NativeScript-Vue uses a modified build of vue. The nativescript-vue package is that build. For TypeScript we need type definitions from Vue, so we need to install the original Vue package.

$ npm install --save-dev vue

Once this is done, we have a problem. Anywhere in our code, if we write

require('vue')

or

import Vue from 'vue'

it will be a huge problem, as we do not ever want to actually use the original vue package. We just want to have it here for type definitions and autocomplete.

Webpack comes to the rescue. We will add this to our webpack config, so that all vue imports are resolved to nativescript-vue:

alias: { 'vue$': 'nativescript-vue' }

Use Typescript

This should set up up with Typescript already. Simply rename .js files to .ts or, if using SFC, then

<template>
  <!-- ... -->
</template>

<script lang="ts">
  // typescript code here
</script>

Use Class-style components

You can now install vue-class-component

$ npm install --save-dev vue-class-component

And write class-styled component code

import {Component} from 'vue-property-decorator'

@Component
export default class MyComponent extends Vue {
  count = 1
  increment () { this.count++ }
}

That's it! You have TypeScript working in NativeScript-Vue!