vue.js - Vue js 2.5.2 & typescript uppgraderingsfel


Jag försöker uppgradera Vue.js till 2.5.2 med TypeScript 2.5.3.

Här är min index.ts-fil:

import Vue from 'vue'

var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!'
    }
})

Här är min tsconfig.json

{
  "compilerOptions": {
    "outDir": "./wwwroot/build/",
    "noImplicitAny": false,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "lib": [
      "dom",
      "es5",
      "es2015.promise"
    ],
    "types": [
      "vue-typescript-import-dts"
    ],
    "experimentalDecorators": true
  },
  "include": [
    "Features/**/*.ts"
  ],
  "exclude": [
    "node_modules",
    "wwwroot"
  ]
}

Och här är felmeddelandet:

FEL i C:\dev\proj\src\Proj.Web\node_modules\vue-typescript-import-dts\index.d.ts (3,36): fel TS2304: Kan inte hitta namnet 'Vue'.

Min setup fungerade bra med Vue.js 2.4.

Jag tar bort "allowSyntheticDefaultImports": true, som sagt här

Tidigare rekommenderade vi redan att använda ES-stil imports (import Vue från ‘vue’) överallt med "allowSyntheticDefaultImports": true i tsconfig.json. De nya typdefinitionerna kommer officiellt att övergå till ES-stil import/export-syntax, så den inställningen är inte längre nödvändig, och användare förväntas använda ES-stil imports i alla fall.

Ser någon vad jag saknar?

Svar #1

Jag har precis startat en ny mapp i VSCode och jag har ett par observationer.

Paketet för Vue på NPM innehåller typinformation, så du behöver inte skaffa ytterligare typer för Vue (dvs. hämta inte @types/vue från NPM).

"dependencies": {
    "vue": "^2.5.2"
}

Med bara vue-paketet, och utan avsnittet:

"types": [
  "vue-typescript-import-dts"
],

Jag kunde kompilera allt utan problem med din exempelkod.

Fullständiga uppgifter...

package.json

{
    "name": "sample-vue",
    "private": true,
    "dependencies": {
        "vue": "^2.5.2"
    }
}

tsconfig.json

{
    "compilerOptions": {
        "outDir": "./wwwroot/build/",
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "sourceMap": true,
        "target": "es5",
        "module": "es2015",
        "moduleResolution": "node",
        "lib": [
            "dom",
            "es5",
            "es2015.promise"
        ],
        "experimentalDecorators": true
    },
    "include": [
        "*.ts"
    ],
    "exclude": [
        "node_modules",
        "wwwroot"
    ]
}

app.ts

import Vue from 'vue'

var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!'
    }
})