Refererar till typdefinitionerna för Vue.js i TypeScript


Jag försöker få typkontroll i min Vue.js-kod (v2.2.1). Som en början vill jag bara att den här raden ska kompileras med TypeScript (dvs. jag vill att Vue-klassen ska kännas igen):

var app = new Vue();

Detta kompilerar om jag importerar Vue med:

import * as Vue from 'vue';

Men det genererar ett require()-anrop:

var Vue = require("vue");

Jag använder inte moduler, jag refererar helt enkelt till Vue-biblioteket från en CDN innan mitt skript.

Jag försökte referera till definitionsfilen på följande sätt:

/// <reference path="../node_modules/vue/types/index.d.ts" />

Men Vue-klassen känns inte igen (förmodligen eftersom den exporteras i definitionsfilen och därför bör importeras?).

Kan jag använda import för att bara referera till typdefinitionerna utan att 'kräva' biblioteket?

Svar #1

Du kan skriva din egen definitionsfil (t.ex. vue-global.d.ts) där Vue kommer att definieras i det globala namnområdet:

import _vue = require('vue');

declare global{
    const Vue: typeof _vue;
}

Glöm inte att inkludera denna definition i tsconfig

Svar #2

Om du använder bibliotek från den officiella dokumentationen. Ladda ner alla filer. Lägg till referens i din TypeScript-fil:

/// <reference path="../path_to../app/TypeScript/_definitely_typed/Vue/2.6.10/index.d.ts" />

Ändra bara filen vue.d.ts.

Kommentera rad:

export const Vue: VueConstructor;

Lägg till efter:

declare global{
    const Vue: VueConstructor;
}

Relaterade artiklar