Vue 2.5 and the render function TypeScript story

Vue 2.5 improved its TypeScript declarations enough that a component can be written without a decorator library, which is the first release where the combination is worth trying on a real project.

import Vue from 'vue';

export default Vue.extend({
  props: { orderId: { type: Number, required: true } },
  data() { return { loading: false }; },
  computed: {
    label(): string { return `Order #${this.orderId}`; }
  }
});

Vue.extend() rather than a plain object literal is what gives this a type inside methods and computed properties — the object form infers nothing and every access is any. Templates are still unchecked, so a typo in an interpolation is a runtime problem regardless. It is a partial win, and partial is a considerable improvement on none.