Question

我正在使用Visual Studio 2017使用Asp.Net Core WebApi后端开发Angular 2 App。我正在关注ASP.NET Core和Angular 2 Book，作者是Valerio De Sanctis。一切都工作正常，直到我添加@ angular / forms包。当我启动Task Runner时会出现一些错误：

[00:28:42] Starting 'app_clean'...
[00:28:42] Starting 'js'...
[00:28:42] Starting 'watch'...
[00:28:42] Finished 'watch' after 27 ms
[00:28:42] Finished 'app_clean' after 77 ms
[00:28:42] Starting 'app'...
C:/Users/Phoenix/Desktop/Angular 2 курс/CollectionsWorkAngular3/src/CollectionsWorkAngular/node_modules/@angular/core/src/facade/lang.d.ts(12,17): error TS2693: 'Map' only refers to a type, but is being used as a value here.
C:/Users/Phoenix/Desktop/Angular 2 курс/CollectionsWorkAngular3/src/CollectionsWorkAngular/node_modules/@angular/core/src/facade/lang.d.ts(13,17): error TS2693: 'Set' only refers to a type, but is being used as a value here.
C:/Users/Phoenix/Desktop/Angular 2 курс/CollectionsWorkAngular3/src/CollectionsWorkAngular/node_modules/rxjs/Observable.d.ts(69,60): error TS2693: 'Promise' only refers to a type, but is being used as a value here.
C:/Users/Phoenix/Desktop/Angular 2 курс/CollectionsWorkAngular3/src/CollectionsWorkAngular/typings/globals/core-js/index.d.ts(2083,41): error TS2339: Property 'unscopables' does not exist on type 'SymbolConstructor'.
[00:28:45] TypeScript: 80 semantic errors
[00:28:45] TypeScript: emit succeeded (with errors)

还有很多错误，例如我刚刚删除的片段。我使用Gulp作为任务管理器，这是我的package.json：


{
  "version": "1.0.0",
  "name": "collectionswork",
  "private": true,
  "dependencies": {
    "@angular/common": "2.4.8",
    "@angular/compiler": "2.4.8",
    "@angular/core": "2.4.8",
    "@angular/http": "2.4.8",
    "@angular/platform-browser": "2.4.8",
    "@angular/platform-browser-dynamic": "2.4.8",
    "@angular/upgrade": "2.4.8",
    "@angular/forms": "2.4.8",
    "core-js": "^2.4.1",
    "reflect-metadata": "^0.1.3",
    "rxjs": "5.2.0",
    "systemjs": "^0.19.37",
    "typings": "^2.1.0",
    "zone.js": "^0.7.2"
  },
  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-clean": "^0.3.2",
    "gulp-concat": "^2.6.0",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-typescript": "^3.1.5",
    "gulp-uglify": "^2.0.0",
    "typescript": "^2.0.0"
  },
  "scripts": {
    "postinstall": "typings install dt~core-js --global"
  }
}

这是我的tsconfig.json：


{
  "compileOnSave": false,
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "system",
    "moduleResolution": "node",
    "noImplicitAny": false,
    "noEmitOnError": false,
    "removeComments": false,
    "target": "es5"
  },
  "exclude": [
    "node_modules",
    "wwwroot"
  ]
}

Answer 1

如果您将core-js安装为全局“postinstall”：“typings install dt~core-js --global --save”，

先卸载它

> typings uninstall core-js --global

> npm cache clean

> npm i @types/core-js@0.9.36 --save-dev

请查看来自https://github.com/DefinitelyTyped/DefinitelyTyped/issues/15140

的bramdebouvere评论

修改tsconfig.json（添加typeRoots和类型）

{
  "compileOnSave": false,
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "system",
    "moduleResolution": "node",
    "noImplicitAny": false,
    "noEmitOnError": false,
    "removeComments": false,
    "target": "es5",
    "typeRoots": [
        "../node_modules/@types"
    ],
    "types": [
        "core-js"
    ]
  },
  "exclude": [
    "node_modules",
    "wwwroot"
  ]
}

它正在使用以下版本

> node -v

v7.7.3

> npm -v

4.1.2

的package.json

  "dependencies": {
    "@angular/common": "^2.4.0",
    "@angular/compiler": "^2.4.0",
    "@angular/core": "^2.4.0",
    "@angular/forms": "^2.4.0",
    "@angular/http": "^2.4.0",
    "@angular/platform-browser": "^2.4.0",
    "@angular/platform-browser-dynamic": "^2.4.0",
    "@angular/router": "^3.4.0",
    "@angular/upgrade": "^2.4.9",
    "core-js": "^2.4.1",
    "reflect-metadata": "^0.1.10",
    "rxjs": "^5.1.0",
    "systemjs": "^0.20.9",
    "zone.js": "^0.7.6"
  },
  "devDependencies": {
    "@types/core-js": "^0.9.36",
    "@types/node": "^7.0.8",
    "gulp": "^3.9.1",
    "gulp-clean": "^0.3.2",
    "gulp-concat": "^2.6.1",
    "gulp-less": "^3.3.0",
    "gulp-sourcemaps": "^2.4.0",
    "gulp-typescript": "^3.1.5",
    "gulp-uglify": "^2.0.0",
    "typescript": "^2.2.1",
    "typings": "2.1.0"
  }

Answer 2

由于最近更新 DefinitelyTyped 的 @ types / core-js 代码导致的问题（有关详细信息，请参阅this GitHub issue）。

最近使用以下解决方法更新了GitHub存储库，该解决方案在VS2015和VS2017上运行良好。您可以从那里获取更新的代码，也可以手动修补本地文件。

如果您选择自行执行此操作，请打开 package.json 文件并替换为：

"scripts": {
    "postinstall": "typings install dt~core-js --global"
}

有了这个：

"scripts": {
    "postinstall": "typings install dt~core-js@0.9.7+20161130133742 --global"
}

这将强制Visual Studio检索core-js类型的显式（和工作）版本+构建，而不是选择最新/最新版本。没有必要卸载/重新安装任何东西，因为VS应该通过相应地更新/typings/文件来自动处理。

对于Visual Studio 2017用户，值得注意的是GitHub repo包含可供VS2017用户使用的VS2017 dedicated branch：在撰写本文时，没有代码更改，只是单向升级.sln和.csproj个文件。说实话，由于VS2017随附了Typescript 2，删除打字也是一种非常可行的方法，但需要进一步更改代码和/或更多第三方组件更新：上述解决方法是最方便的解决方法将本书的印刷代码保留原样的问题。

我的博客上的this post也引用了该问题，作为使用第三方库时可能发生的常见情况的一个很好的例子。

Angular 2 Typescript编译错误

2 个答案: