Как я могу получить Vue.JS 2.0 typings для TypeScript, работающего с Visual Studio?

я пытаюсь дозвониться до вю.JS 2.0 typings работает с TypeScript в Visual Studio. Раньше я использовал эти typings от DefinitelyTyped, но они для Vue.js 1.0 и, таким образом, не совпадают. Тем не менее, они работали просто отлично, и позвольте мне работать с Vue тип.

С тех пор я перешел на использование файлов ввода, которые поставляются с Vue.выпуски js (здесь). Я включил их в свой проект в my ~/Scripts/typings/vue папка, но мой проект не понимает их.

я понял, что эти файлы ввода предназначены для использования через импорт/экспорт, возможно? Я не использую другие файлы ввода, которые работают таким образом, поэтому я не уверен, как правильно реализовать типы, чтобы они были доступны глобально для моего проекта.

у меня есть пример решения, которое показывает пример того, что я пробовал - скачать здесь из моего репозитория github.

вот структура моего :

enter image description here

_references.д.ТС содержание

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

vue_test.ТС содержание

namespace Test
{
    export class MyClass
    {
        public initialize()
        {
            var component = this.getComponent();
        }

        private getComponent(): Vue.Component
        {
            return Vue.component("test", {
                template: "<div></div>",
                props: ["test"],
                methods: {
                    onClick: () =>
                    {
                    }
                }
            });
        }
    }
}

я ожидал бы, что у меня будет доступ к Vue.Component пространства имен и другие пространства имен, объявленные в typings/vue/index.d.ts, но, похоже, это не так.

я попытался импортировать экспортированный класс в global, как это:

import * as _Vue from "./index";

declare global
{
    export class Vue extends _Vue
    {

    }
}

однако это позволяет мне получить доступ только к root Vue класс, и поэтому я не могу делать такие вещи, как указать Vue.Component как тип, или любое другое пространство имен за пределы Vue.

прочая информация:
Visual Studio 2015
Вью.js версии 2.2.1
TypeScript версии 2.1

обновление после предложений от @unional Вот моя новая папка структура: enter image description here

больше никаких _references.d.ts, используя tsconfig.вместо json-файле. В tsconfig.файл json содержит следующее:

{
    "compilerOptions": {
        "sourceMap": true
    },
    "include": [
        "../../**/*.ts"
    ]
}

вышеуказанное импортирует все .TS файлы в проект. The ~/Scripts/typings/custom-typings/vue.d.ts файл содержит следующее:

export * from "vue"
export as namespace Vue

Visual Studio говорит мне Cannot find module 'vue', поэтому мои шрифты все еще не функционируют, хотя tsconfig.файл json работает (я добавил ввод jQuery, чтобы проверить это).

вот ссылка на обновлено решение, показывающее новые проблемы:[ссылка]

11
typescript typescript-typings visual-studio vue.js vuejs2

3 ответов

С НПМ

выпадающий в командной строке в корневом каталоге вашего приложения, чтобы использовать NPM и интерфейс командной строки TypeScript.

  • если у вас еще нет пакета.файл json, затем сначала запустите npm init.
  • затем установить vue.Яш, работать npm install --save vue.
  • для установки его типов запустите npm install --save-dev @types/vue.
  • Если Вам также не хватает tsconfig.файл json, затем запустите tsc --init.
  • в этот момент Вы сможете построить бегом tsc.

без НПМ

не использовать NPM нетрадиционно и потребует много ручной работы. Вот один из таких ручных подходов.

Скачать VueJS 2.1.1 из репозитория GitHub. После извлечения архива,

  1. положите содержимое dist на ,
  2. положите содержимое typings на
5

поскольку ошибка во время компиляции, в ней нет большой проблемы. вы можете использовать этот плагин для более быстрого развития от здесь

кроме того, код должен быть как

import Vue from 'vue'
import Component from 'vue-class-component'
// The @Component decorator indicates the class is a Vue component
@Component({

  template: ''
})
export default class MyComponent extends Vue {



}

и так далее. Вы все еще можете использовать vuejs внутри ваших файлов cshtml.

1

я смог использовать информацию из комментария @unional, но с небольшим изменением:

я добавил Это к моему обычаю-vue.д.файл ТС:

import * as _Vue from 'vue';
export as namespace Vue;
export = _Vue;

кроме того, мне пришлось создать package.json файл со следующим:

{
    "dependencies": {
        "vue": "^2.2.1"
    }
}

наконец, мне нужно добавить node_modules папка в той же области, что и моя . Он имеет следующее:

+-- node_modules
|   +-- vue
|   |   +-- package.json
|   |   +-- types
|   |   |   +-- index.d.ts
|   |   |   +-- options.d.ts
|   |   |   +-- plugin.d.ts
|   |   |   +-- vnode.d.ts
|   |   |   +-- vue.d.ts

package.json простой содержит:

{
  "typings": "types/index.d.ts"
}

и теперь все Работа

редактировать
В качестве альтернативы я обнаружил, что могу избежать целого node_modules что параметр на moduleResolution to Classic. После этого я изменил свой custom-vue.d.ts импорт, чтобы выглядеть так:

import * as _Vue from "../vue/index";
1