ts-vue-plugin

0.1.3 verified Sat Apr 25 auth: no javascript

Alpha-stage TypeScript Language Service Plugin for Vue that provides TypeScript intellisense inside .vue files by parsing the script section and wrapping default exports in new Vue() for contextual typing. Version 0.1.3 (last release). It integrates with any editor supporting the TypeScript language service (VS Code, Emacs, Vim via tsuquyomi-vue). Unlike Vetur which is VS Code-specific, this plugin is editor-agnostic. It resolves .vue imports but does not support template or style sections; completions only work inside script tags.

Common errors

error Cannot find module 'vue-template-compiler' ↓

cause Missing peer dependency vue-template-compiler.

fix

Run npm install vue-template-compiler --save-dev

error TypeScript plugin 'ts-vue-plugin' is not installed ↓

cause Plugin is not in node_modules or tsconfig.json is misconfigured.

fix

Check that ts-vue-plugin is installed and listed correctly in compilerOptions.plugins.

error Property 'message' does not exist on type '{}' ↓

cause Default export not wrapped due to non-object literal syntax.

fix

Ensure you use export default { ... } with an object literal; avoid variables or function returns.

error Cannot use JSX unless the '--jsx' flag is provided ↓

cause Vue files inferred as TSX/JSX incorrectly.

fix

Add "allowJs": true or set "jsx": "preserve" in tsconfig.json.

Warnings

gotcha Only ES6 export default syntax is supported; CommonJS module.exports will not be recognized. ↓

fix Use export default { ... } syntax inside script tags.

gotcha Only script sections are processed; template and style sections are completely ignored. No HTML/CSS completions. ↓

fix Use Vetur for full .vue file support (template+script+style).

gotcha Only lang="javascript", lang="typescript", or no lang attribute trigger the language service. Other lang values (e.g., lang="coffeescript") are ignored. ↓

fix Ensure script tag has lang="ts" or lang="js" or no lang attribute.

deprecated Package is in alpha and has not been updated since 2017. Consider using Volar for modern Vue 3 / Vue 2 TS support. ↓

fix Migrate to @vue/language-server (Volar) or Vetur for VS Code users.

gotcha To use plugin outside VS Code (e.g., Emacs, Vim), you must manually configure the editor to use workspace TypeScript version. ↓

fix Run 'Select TypeScript version' in VS Code or set tsserver path in your editor.

Install

npm install ts-vue-plugin

yarn add ts-vue-plugin

pnpm add ts-vue-plugin

Imports

plugin

wrong

const vuePlugin = require('ts-vue-plugin')

correct

Add to tsconfig.json plugins array: { "name": "ts-vue-plugin" }

Not a regular import; it's a TypeScript language service plugin configured in tsconfig.json.

none
wrong
```
import { Foo } from 'Foo.vue'
```
correct
```
import Foo from 'Foo.vue'
```
Default imports are resolved; named imports are not supported.
all exports
wrong
```
module.exports = { ... }
```
correct
```
export default { ... }
```
Only ES6 export default syntax is recognized. CommonJS module.exports is not supported.

Quickstart

Shows configuration in tsconfig.json and an example .vue script that triggers TypeScript intellisense via the plugin.

// tsconfig.json
{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "plugins": [{ "name": "ts-vue-plugin" }]
  }
}

// Install
// npm install ts-vue-plugin vue-template-compiler

// In a .vue file (script section):
// Only ES6 export default is supported
// <script lang="ts">
export default {
  data() {
    return {
      message: 'Hello Vue!'
    }
  },
  methods: {
    greet() {
      console.log(this.message)  // TypeScript intellisense works here
    }
  }
}
// </script>

// Import other .vue files:
// import Other from './Other.vue';  // Resolves type