代码之家 › 专栏 › 技术社区 › Archeg

在typescript中扩充vue.js

vue.js typescript

3

Archeg · 技术社区 · 8 年前

https://vuejs.org/v2/guide/typescript.html#Augmenting-Types-for-Use-with-Plugins

vue.d.ts 在下面 ./Definitions main.ts

require("./Definitions/vue.d.ts");

Vue.D.TS公司

 // 1. Make sure to import 'vue' before declaring augmented types
import Vue from 'vue'

// 2. Specify a file with the types you want to augment
//    Vue has the constructor type in types/vue.d.ts
declare module 'vue/types/vue' {
    // 3. Declare augmentation for Vue
    interface Vue {
        $myProperty: string
    }
}

但这是:

var vm = new Vue()
console.log(vm.$myProperty);

declare module 'vue/types/vue' declare module 'vue' "Cannot augument module 'vue' because it resolves to a non-module entity"

{projectDir}\node_modules\@types\vue\index.d.ts

我该怎么做?

1 回复 | 直到 8 年前

1

4

Harshal Patil 8 年前

tsconfig.json compilerOptions

{
    "compilerOptions": {

        "baseUrl": ".",

        // other options go here

        "typeRoots": [
            "./node_modules/@types",
            "./typings"
        ]
    }
}

typings/vue t配置.json 类型/Vue index.d.ts

import Vue from 'vue';
import { AppStore } from '../../src/store/store';

declare module 'vue/types/vue' {
    // Global properties can be declared
    // on the `VueConstructor` interface
    interface VueConstructor {
        // some more augmentation
    }

    // Properties added to Vue interface are added to Vue instance
    interface Vue {
        store$: AppStore;
    }
}

node_modules/@types/vue node_modules/vue