mrspark:vue-typescript-babel

v1.0.1Published 8 months ago

Integrate TypeScript with vue single-file components for Meteor

This meteor package adds TypeScript support in your single-file .vue components.

Prerequisites

This package is an add-on for akryum:vue-component. You must first have that package installed.

Installation

meteor add nathantreid:vue-typescript

Usage

Set your script's lang attribute to ts or typescript:

1<script lang="ts">
2  let message: string;
3
4  export default {
5    mounted() {
6      message = 'world';
7      console.log(`Hello, ${message}!`);
8    }
9  }
10</script>

Or with vue-class-component:

1<script lang="typescript">
2  import Vue from 'vue'
3  import Component from 'vue-class-component'
4
5  let message: string;
6
7  @Component
8  class MyButton extends Vue {
9    mounted() {
10      message = 'world';
11      console.log(`Hello, ${message}!`);
12    }
13  }
14    
15  // The export default has to be on a separate line due to the way the code is transpiled.
16  export default MyButton;
17</script>

Importing TypeScript files

This plugin only handles compilation of TypeScript within .vue files. To import other TypeScript files, you must install a .ts compiler such as nathantreid:typescript-babel or barbatus:typescript.

TypeScript compilation notes

The Babel TypeScript compiler performs transpilation only; type-checking is not supported. As a result, this plugin currently doesn't provide type checking.