Generate TypeScript declaration files for .vue files
You can use vuetype
command after exec one of following commands.
$ npm install --global vuetype # npm
$ yarn global add vuetype # yarn
Specify the directory that includes your .vue
files as the 2nd argument of vuetype
command. Note that the .vue
files should have TypeScript code (in <script lang="ts">
element).
vuetype src/components
Then .vue.d.ts
file corresponding .vue
file will be output. So you can import each .vue
component with concrete type declaration! This would useful if you would like to unit test your components in TypeScript.
For example, if there is the following component:
<template>
<div>{{ message }}</div>
</template>
<script lang="ts">
import Vue = require('vue')
import Component from 'vue-class-component'
@Component
export default class MyComp extends Vue {
message = 'Hello'
}
</script>
You will acquire the following declaration file:
import Vue = require('vue');
export default class MyComp extends Vue {
message: string;
}
You can enable watch mode by adding --watch
(shorthand -w
) flag. In the watch mode, vuetype watches update of .vue
files and generates declaration files when the .vue
files are updated.
vuetype --watch src/components
MIT