Angular 2 TypeScript錯誤

Question

我已經沿着angular 2網站的快速入門。我試圖讓我的gulpfile設置屬性在我的Visual Studio aspnetcore項目裏面傳輸我的腳本。我使用的是typescript 1.8.10，而不是2.0版本，它在SO上的其他地方發佈了它的解決方案。

C：

運行 「TS2」 任務時，我得到這些錯誤的70 /路徑/到/我/項目/快速入門/ node_modules/@角/普通/ src目錄/管材/ async_pipe。 d.ts（41,38）：錯誤TS2304：找不到'Promise'的名稱。 c：/path/to/my/project/Quickstart/node_modules/@angular/compiler/src/compile_metadata.d.ts（347,20）：錯誤TS2304：找不到名稱'Set'。 c：/path/to/my/project/Quickstart/node_modules/@angular/compiler/src/compile_metadata.d.ts（348,15）：錯誤TS2304：找不到名稱'Set'。 c：/path/to/my/project/Quickstart/node_modules/@angular/compiler/src/directive_normalizer.d.ts（19,100）：錯誤TS2304：找不到名字'Promise'。

我Gulpfile.js：

var ts = require("gulp-typescript"); 
var gulp = require('gulp'); 
var clean = require("gulp-clean"); 

// Delete the dist directory 
gulp.task("clean", function() { 
    return gulp.src(destPath) 
     .pipe(clean()); 
}); 

gulp.task("scriptsNStyles",() => { 
    gulp.src([ 
      "core-js/client/**", 
      "systemjs/dist/system.src.js", 
      "reflect-metadata/**", 
      "rxjs/**", 
      "zone.js/dist/**", 
      "@angular/**", 
      "jquery/dist/jquery.*js" 
    ], { 
     cwd: "node_modules/**" 
    }) 
     .pipe(gulp.dest("./wwwroot/lib")); 
}); 

var tsProject = ts.createProject("./tsconfig.json"); 
gulp.task("ts", function (done) { 
    //var tsResult = tsProject.src() 
    var paths = { 
     scripts: ['./wwwroot/app/*.ts'] 
    }; 

    gulp.src(paths.scripts).pipe(gulp.dest('wwwroot/app')); 
}); 

gulp.task('ts2', function (done) { 
    var tsResult = gulp.src([ 
      "wwwroot/app/*.ts" 
    ]) 
     .pipe(ts(tsProject), undefined, ts.reporter.fullReporter()); 
    return tsResult.js.pipe(gulp.dest('./wwwroot/app')); 
}); 


gulp.task("watch", ["watch.ts"]); 

gulp.task("watch.ts", ["ts"], function() { 
    return gulp.watch("./wwwroot/app/*.ts", ["ts"]); 
}); 

gulp.task("default", ["scriptsNStyles", "watch"]); 

tsconfig.json：

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "removeComments": false, 
    "noImplicitAny": false 
    }, 
    "exclude": [ 
    "node_modules", 
    "typings/index", 
    "typings/index.d.ts", 
    "wwwroot/lib" 
    ], 
    "compileOnSave": true 
} 

的package.json：

{ 
    "version": "1.0.0", 
    "name": "asp.net", 
    "scripts": { 
    "postinstall": "typings install", 
    "typings": "typings" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.7", 
    "@angular/compiler": "2.0.0-rc.7", 
    "@angular/compiler-cli": "0.6.1", 
    "@angular/core": "2.0.0-rc.7", 
    "@angular/forms": "2.0.0-rc.7", 
    "@angular/http": "2.0.0-rc.7", 
    "@angular/platform-browser": "2.0.0-rc.7", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.7", 
    "@angular/router": "3.0.0-rc.3", 
    "@angular/upgrade": "2.0.0-rc.7", 
    "core-js": "^2.4.1", 
    "reflect-metadata": "^0.1.3", 
    "rxjs": "5.0.0-beta.12", 
    "systemjs": "0.19.27", 
    "zone.js": "^0.6.21", 
    "angular2-in-memory-web-api": "0.0.19", 
    "bootstrap": "^3.3.6" 
    }, 
    "devDependencies": { 
    "typescript": "^1.8.10", 
    "gulp": "^3.9.1", 
    "path": "^0.12.7", 
    "gulp-clean": "^0.3.2", 
    "gulp-concat": "^2.6.0", 
    "gulp-typescript": "^2.13.6", 
    "typings": "^1.3.1", 
    "gulp-tsc": "^1.2.0" 
    } 
} 

Typings.json：

{ 
    "globalDependencies": { 
    "core-js": "registry:dt/core-js#0.0.0+20160602141332", 
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255", 
    "node": "registry:dt/node#6.0.0+20160621231320" 
    } 
} 

轉譯似乎可行，但我不喜歡這些錯誤。我該如何解決？

Answer 1

從Typescript 2.0開始將不贊成使用類型。更簡單的解決方案是使用npm類型定義包。我知道你問1.8的解決方案，但我強烈的建議是現在刪除類型！

• 從Microsoft下載Typescript 2.0.2或更高版本。 https://www.microsoft.com/en-us/download/details.aspx?id=48593或NPM安裝：npm install -g typescript

• 添加以下行到您的package.json文件"@types/core-js": "^0.9.32","@types/jasmine": "^2.2.33",和"@types/node": "^6.0.38",或者使用命令行：npm install @types/core-js @types/jasmin @types/node --save-dev

• 在你tsconfig.json文件中添加以下內容：

tsconfig.json

"typeRoots": [ 
    "node_modules/@types" 
], 
"types": [ 
    "core-js", 
    "jasmine", 
    "node" 
] 

core-js類型定義將擺脫您的Promise和Set定義錯誤。

在typescript 2.0中，類型定義更容易使用。你可以通過相同的過程來獲取lodash，d3或其他你想使用的js庫的定義。你可以在Microsoft's TypeSearch website找到類型。在微軟博客上閱讀更多關於它的信息：https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files/

你會想把你的devDependencies更新爲「typescript」：「^ 2.0.2」。或npm install typescript --save-dev

要更新gulpfile使用打字稿的最新版本的tsProject行改成這樣：

var tsProject = ts.createProject('tsconfig.json', { 
    typescript: require('typescript') 
}); 

更多信息，請參見gulp-typescript documentation on Github。