Vue + TypeScript override `export default Vue`

Question

I am trying to use Vue and TypeScript. I am trying to compile to AMD in my tsconfig.

The type definition that comes with Vue.js states in vue/types/index.d.ts

export default Vue;

However, that causes typescript to compile this:

import Vue as "vue";
export default Vue.extend({ ... });

essentially, into this:

define(["vue"], function(vue) {
  exports.default = vue.default.extend({  ... })
});

Notice, that it believes vue should have a property .default, which it does not. Is there anyway to write a type definition that overrides the default vue type definition that states something like:

export = Vue;

or some flag in tsconfig that tells typescript not to add that .default property to the compiled AMD module?

Answer 1

Enabling the esModuleInterop compiler option will make TypeScript generate code to check for both vue and vue.default at runtime.

As you note, the Vue type declaration is inaccurate, but based on this previous issue, I don't know if a new issue about it will be well received.