question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[feature request] use `vue-typescript` as drop-in replacement of `typescript`

See original GitHub issue

Today to use Typescript TypeChecker API on SFC files, or other internal TS APIs, we have to extract the script content using @vue/compiler-sfc before using them. Doing this transform prevents us to keep the original context.

The idea would be to use the vue-typescript package as a drop-in replacement for typescript package.

Example:

import * as ts from 'vue-typescript'

const program = ts.createProgram([`my-component.vue`], {}) // <- vue-typescript would allow to load .vue sfc files
const checker = program.getTypeChecker(); // this would be available!

Issue Analytics

  • State:closed
  • Created a year ago
  • Reactions:1
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
johnsoncodehkcommented, Jul 22, 2022

We can’t abstract type checker api into vue-typescript, because one vue document is correspond to multiple TS source file, but I make a example to show how to use @volar/vue-language-core api to do it, see https://github.com/johnsoncodehk/volar-starter/blob/example-extra-prop-type/see-hello-world-props.js.

1reaction
johnsoncodehkcommented, Jul 24, 2022

@sxzz The output error is because getDefaultLibFileName result incorrect, fixed by https://github.com/johnsoncodehk/volar-starter/commit/365b0367d5ac2533ef3ea062f866e6703f09ce30.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How To Use TypeScript with Vue Single File Components
In this tutorial, you will use @vue/cli to generate a new Vue.js 2.0 application with TypeScript and build a Single-File Component (SFC).
Read more >
Use Take Over Mode instead of TS Plugin #471 - GitHub
Reload your VS Code project; You will see Take Over Mode enabled message, meaning that all typescript features are provided by Vue Language...
Read more >
How to use Vue 3 with TypeScript - LogRocket Blog
In this tutorial, we'll demonstrate how to build a Vue app completely in TypeScript. We'll highlight some of the benefits of using TypeScript...
Read more >
TypeScript errors when editing old Vue 3 components but not ...
I was able to fix these import errors by upgrading TypeScript from 3.9.3 to 4.4.4: npm install typescript@latest. It seems that Vue 3.2.0 ......
Read more >
Documentation - TypeScript 4.5
Rosylight, TypeScript now supports a new module setting: es2022 . The main feature in module es2022 is top-level await , meaning you can...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found