升级到 Angular 5 后，我的项目无法构建
After upgrading to Angular 5 my project won't build
升级到 Angular 5 后，我的项目无法构建。我正在使用 Visual Studio 2017 15.4.3 并且正在使用 SystemJs。我的打字稿版本是 2.4.2.
我收到以下 8 个错误：
Error Build:',' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 31
Error Build:Type parameter declaration expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts 34 oolumn 33
Error Build:Expression expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 37
Error Build:')' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 42
Error Build:';' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 50
Error Build:Declaration or statement expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts 34 oolumn 51
Error Build:':' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 35 oolumn 10
Error Build:',' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 35 oolumn 28
下面是我的 package.json 文件：
{
"name": "mic",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "webpack-dev-server --port=4200",
"build": "webpack -p",
"test": "karma start ./karma.conf.js",
"lint": "ng lint",
"e2e": "protractor ./protractor.conf.js",
"copy": "xcopy \"dist\" \"..\Mic\Scripts\NgApp\" /i /s /r /y /c",
"prepree2e": "npm start",
"pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
},
"private": true,
"dependencies": {
"@angular/animations": "^5.0.2",
"@angular/common": "^5.0.2",
"@angular/compiler": "^5.0.2",
"@angular/core": "^5.0.2",
"@angular/forms": "^5.0.2",
"@angular/http": "^5.0.2",
"@angular/platform-browser": "^5.0.2",
"@angular/platform-browser-dynamic": "^5.0.2",
"@angular/platform-server": "^5.0.2",
"@angular/router": "^5.0.2",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"@progress/kendo-angular-buttons": "^1.1.1",
"@progress/kendo-angular-dateinputs": "^1.4.0",
"@progress/kendo-angular-dialog": "^1.3.0",
"@progress/kendo-angular-dropdowns": "^1.2.3",
"@progress/kendo-angular-excel-export": "^1.0.5",
"@progress/kendo-angular-grid": "^1.6.1",
"@progress/kendo-angular-inputs": "^1.3.3",
"@progress/kendo-angular-intl": "^1.3.0",
"@progress/kendo-angular-l10n": "^1.0.5",
"@progress/kendo-angular-popup": "^1.3.0",
"@progress/kendo-angular-resize-sensor": "^1.0.5",
"@progress/kendo-data-query": "^1.1.1",
"@progress/kendo-drawing": "^1.4.0",
"@progress/kendo-file-saver": "^1.0.4",
"@progress/kendo-popup-common": "^1.2.3",
"@progress/kendo-theme-default": "^2.44.0",
"@telerik/kendo-intl": "^1.3.0",
"angular2-notifications": "^0.9.6",
"classlist.js": "^1.1.20150312",
"core-js": "^2.5.1",
"intl": "^1.2.5",
"libphonenumber-js": "^0.4.40",
"rxjs": "5.5.2",
"web-animations-js": "^2.3.1",
"zone.js": "^0.8.18"
},
"devDependencies": {
"@angular/cli": "^1.5.0",
"@angular/compiler-cli": "^5.0.2",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.92",
"angular-in-memory-web-api": "^0.3.2",
"autoprefixer": "^6.5.3",
"cldr-data": "^31.0.2",
"codelyzer": "~2.0.0",
"css-loader": "^0.27.3",
"cssnano": "^3.10.0",
"exports-loader": "^0.6.3",
"file-loader": "^0.10.0",
"istanbul-instrumenter-loader": "^2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"json-loader": "^0.5.4",
"jszip": "^3.1.3",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-sourcemap-loader": "^0.3.7",
"less-loader": "^4.0.2",
"postcss-loader": "^1.3.3",
"postcss-url": "^5.1.2",
"protractor": "~5.1.0",
"raw-loader": "^0.5.1",
"rollup": "^0.43.0",
"rollup-plugin-commonjs": "^8.0.2",
"rollup-plugin-node-resolve": "^3.0.0",
"rollup-plugin-uglify": "^2.0.1",
"sass-loader": "^6.0.3",
"script-loader": "^0.7.0",
"source-map-loader": "^0.1.5",
"style-loader": "^0.13.1",
"stylus-loader": "^3.0.1",
"systemjs": "^0.20.19",
"systemjs-plugin-babel": "0.0.25",
"systemjs-plugin-json": "^0.3.0",
"ts-node": "~2.0.0",
"tslib": "^1.6.1",
"tslint": "~4.5.0",
"typescript": "2.4.2",
"url-loader": "^0.5.7",
"webpack-dev-server": "~2.4.2"
}
}
下面是我的tsconfig.json
{
"compileOnSave": true,
"compilerOptions": {
"importHelpers": true,
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es2017",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es7",
"dom"
]
},
"exclude": [
"test.ts",
"**/*.spec.ts",
"node_modules",
"dist",
"../Scripts"
]
}
请帮忙。这很令人沮丧。
谢谢。
试试这个 packages.json:
{
"name": "mic",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "webpack-dev-server --port=4200",
"build": "webpack -p",
"test": "karma start ./karma.conf.js",
"lint": "ng lint",
"e2e": "protractor ./protractor.conf.js",
"copy": "xcopy \"dist\" \"..\Mic\Scripts\NgApp\" /i /s /r /y /c",
"prepree2e": "npm start",
"pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
},
"private": true,
"dependencies": {
"@angular/animations": "5.0.0",
"@angular/common": "5.0.0",
"@angular/compiler": "5.0.0",
"@angular/core": "5.0.0",
"@angular/forms": "5.0.0",
"@angular/http": "5.0.0",
"@angular/platform-browser": "5.0.0",
"@angular/platform-browser-dynamic": "5.0.0",
"@angular/router": "5.0.0",
"@angular/platform-server": "5.0.0",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"@progress/kendo-angular-buttons": "^1.1.1",
"@progress/kendo-angular-dateinputs": "^1.4.0",
"@progress/kendo-angular-dialog": "^1.3.0",
"@progress/kendo-angular-dropdowns": "^1.2.3",
"@progress/kendo-angular-excel-export": "^1.0.5",
"@progress/kendo-angular-grid": "^1.6.1",
"@progress/kendo-angular-inputs": "^1.3.3",
"@progress/kendo-angular-intl": "^1.3.0",
"@progress/kendo-angular-l10n": "^1.0.5",
"@progress/kendo-angular-popup": "^1.3.0",
"@progress/kendo-angular-resize-sensor": "^1.0.5",
"@progress/kendo-data-query": "^1.1.1",
"@progress/kendo-drawing": "^1.4.0",
"@progress/kendo-file-saver": "^1.0.4",
"@progress/kendo-popup-common": "^1.2.3",
"@progress/kendo-theme-default": "^2.44.0",
"@telerik/kendo-intl": "^1.3.0",
"angular2-notifications": "^0.9.6",
"classlist.js": "^1.1.20150312",
"core-js": "^2.5.1",
"intl": "^1.2.5",
"libphonenumber-js": "^0.4.40",
"rxjs": "5.5.2",
"web-animations-js": "^2.3.1",
"zone.js": "^0.8.18"
},
"devDependencies": {
"@angular/cli": "^1.5.0",
"@angular/compiler-cli": "^5.0.2",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.92",
"angular-in-memory-web-api": "^0.3.2",
"autoprefixer": "^6.5.3",
"cldr-data": "^31.0.2",
"codelyzer": "~2.0.0",
"css-loader": "^0.27.3",
"cssnano": "^3.10.0",
"exports-loader": "^0.6.3",
"file-loader": "^0.10.0",
"istanbul-instrumenter-loader": "^2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"json-loader": "^0.5.4",
"jszip": "^3.1.3",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-sourcemap-loader": "^0.3.7",
"less-loader": "^4.0.2",
"postcss-loader": "^1.3.3",
"postcss-url": "^5.1.2",
"protractor": "~5.1.0",
"raw-loader": "^0.5.1",
"rollup": "^0.43.0",
"rollup-plugin-commonjs": "^8.0.2",
"rollup-plugin-node-resolve": "^3.0.0",
"rollup-plugin-uglify": "^2.0.1",
"sass-loader": "^6.0.3",
"script-loader": "^0.7.0",
"source-map-loader": "^0.1.5",
"style-loader": "^0.13.1",
"stylus-loader": "^3.0.1",
"systemjs": "^0.20.19",
"systemjs-plugin-babel": "0.0.25",
"systemjs-plugin-json": "^0.3.0",
"ts-node": "~2.0.0",
"tslib": "^1.6.1",
"tslint": "~4.5.0",
"typescript": "2.6.1",
"url-loader": "^0.5.7",
"webpack-dev-server": "~2.4.2"
}
}
删除 node_modules 文件夹 & 运行 npm install
我终于想出了解决办法。我所做的是从 Visual Studio 中删除 Typescript 扩展（取消选中 "Get Tools and Features" 菜单中的 TypeScript 选项，并将其从 "Extensions and Updates) and then downloading and installing "TypeScript 2.6.1 for Visual Studio 2017 中删除”。我曾尝试只安装 "TypeScript 2.6.1 for Visual Studio 2017"，但那没有用。我的问题只能通过首先从 Visual Studio 2017 中删除 Typescript 如上所述然后安装 "TypeScript 2.6.1 for Visual Studio 2017" 来解决。在尝试任何这些之前，我确实按照 Melchia 的建议删除了 node_modules 目录，但它本身并没有工作，但也许首先这样做是修复的必要部分，尽管我不确定。如果删除 Typescript 然后安装它对你不起作用，你可以尝试删除 node_modules 目录和 运行 npm install。希望这对其他人有帮助。
升级到 Angular 5 后，我的项目无法构建。我正在使用 Visual Studio 2017 15.4.3 并且正在使用 SystemJs。我的打字稿版本是 2.4.2.
我收到以下 8 个错误：
Error Build:',' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 31
Error Build:Type parameter declaration expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts 34 oolumn 33
Error Build:Expression expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 37
Error Build:')' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 42
Error Build:';' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 34 oolumn 50
Error Build:Declaration or statement expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts 34 oolumn 51
Error Build:':' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 35 oolumn 10
Error Build:',' expected. node_modules\@angular\platform-browser\src\browser\transfer_state.d.ts line 35 oolumn 28
下面是我的 package.json 文件：
{
"name": "mic",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "webpack-dev-server --port=4200",
"build": "webpack -p",
"test": "karma start ./karma.conf.js",
"lint": "ng lint",
"e2e": "protractor ./protractor.conf.js",
"copy": "xcopy \"dist\" \"..\Mic\Scripts\NgApp\" /i /s /r /y /c",
"prepree2e": "npm start",
"pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
},
"private": true,
"dependencies": {
"@angular/animations": "^5.0.2",
"@angular/common": "^5.0.2",
"@angular/compiler": "^5.0.2",
"@angular/core": "^5.0.2",
"@angular/forms": "^5.0.2",
"@angular/http": "^5.0.2",
"@angular/platform-browser": "^5.0.2",
"@angular/platform-browser-dynamic": "^5.0.2",
"@angular/platform-server": "^5.0.2",
"@angular/router": "^5.0.2",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"@progress/kendo-angular-buttons": "^1.1.1",
"@progress/kendo-angular-dateinputs": "^1.4.0",
"@progress/kendo-angular-dialog": "^1.3.0",
"@progress/kendo-angular-dropdowns": "^1.2.3",
"@progress/kendo-angular-excel-export": "^1.0.5",
"@progress/kendo-angular-grid": "^1.6.1",
"@progress/kendo-angular-inputs": "^1.3.3",
"@progress/kendo-angular-intl": "^1.3.0",
"@progress/kendo-angular-l10n": "^1.0.5",
"@progress/kendo-angular-popup": "^1.3.0",
"@progress/kendo-angular-resize-sensor": "^1.0.5",
"@progress/kendo-data-query": "^1.1.1",
"@progress/kendo-drawing": "^1.4.0",
"@progress/kendo-file-saver": "^1.0.4",
"@progress/kendo-popup-common": "^1.2.3",
"@progress/kendo-theme-default": "^2.44.0",
"@telerik/kendo-intl": "^1.3.0",
"angular2-notifications": "^0.9.6",
"classlist.js": "^1.1.20150312",
"core-js": "^2.5.1",
"intl": "^1.2.5",
"libphonenumber-js": "^0.4.40",
"rxjs": "5.5.2",
"web-animations-js": "^2.3.1",
"zone.js": "^0.8.18"
},
"devDependencies": {
"@angular/cli": "^1.5.0",
"@angular/compiler-cli": "^5.0.2",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.92",
"angular-in-memory-web-api": "^0.3.2",
"autoprefixer": "^6.5.3",
"cldr-data": "^31.0.2",
"codelyzer": "~2.0.0",
"css-loader": "^0.27.3",
"cssnano": "^3.10.0",
"exports-loader": "^0.6.3",
"file-loader": "^0.10.0",
"istanbul-instrumenter-loader": "^2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"json-loader": "^0.5.4",
"jszip": "^3.1.3",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-sourcemap-loader": "^0.3.7",
"less-loader": "^4.0.2",
"postcss-loader": "^1.3.3",
"postcss-url": "^5.1.2",
"protractor": "~5.1.0",
"raw-loader": "^0.5.1",
"rollup": "^0.43.0",
"rollup-plugin-commonjs": "^8.0.2",
"rollup-plugin-node-resolve": "^3.0.0",
"rollup-plugin-uglify": "^2.0.1",
"sass-loader": "^6.0.3",
"script-loader": "^0.7.0",
"source-map-loader": "^0.1.5",
"style-loader": "^0.13.1",
"stylus-loader": "^3.0.1",
"systemjs": "^0.20.19",
"systemjs-plugin-babel": "0.0.25",
"systemjs-plugin-json": "^0.3.0",
"ts-node": "~2.0.0",
"tslib": "^1.6.1",
"tslint": "~4.5.0",
"typescript": "2.4.2",
"url-loader": "^0.5.7",
"webpack-dev-server": "~2.4.2"
}
}
下面是我的tsconfig.json
{
"compileOnSave": true,
"compilerOptions": {
"importHelpers": true,
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es2017",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es7",
"dom"
]
},
"exclude": [
"test.ts",
"**/*.spec.ts",
"node_modules",
"dist",
"../Scripts"
]
}
请帮忙。这很令人沮丧。
谢谢。
试试这个 packages.json:
{
"name": "mic",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"start": "webpack-dev-server --port=4200",
"build": "webpack -p",
"test": "karma start ./karma.conf.js",
"lint": "ng lint",
"e2e": "protractor ./protractor.conf.js",
"copy": "xcopy \"dist\" \"..\Mic\Scripts\NgApp\" /i /s /r /y /c",
"prepree2e": "npm start",
"pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
},
"private": true,
"dependencies": {
"@angular/animations": "5.0.0",
"@angular/common": "5.0.0",
"@angular/compiler": "5.0.0",
"@angular/core": "5.0.0",
"@angular/forms": "5.0.0",
"@angular/http": "5.0.0",
"@angular/platform-browser": "5.0.0",
"@angular/platform-browser-dynamic": "5.0.0",
"@angular/router": "5.0.0",
"@angular/platform-server": "5.0.0",
"@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.5",
"@progress/kendo-angular-buttons": "^1.1.1",
"@progress/kendo-angular-dateinputs": "^1.4.0",
"@progress/kendo-angular-dialog": "^1.3.0",
"@progress/kendo-angular-dropdowns": "^1.2.3",
"@progress/kendo-angular-excel-export": "^1.0.5",
"@progress/kendo-angular-grid": "^1.6.1",
"@progress/kendo-angular-inputs": "^1.3.3",
"@progress/kendo-angular-intl": "^1.3.0",
"@progress/kendo-angular-l10n": "^1.0.5",
"@progress/kendo-angular-popup": "^1.3.0",
"@progress/kendo-angular-resize-sensor": "^1.0.5",
"@progress/kendo-data-query": "^1.1.1",
"@progress/kendo-drawing": "^1.4.0",
"@progress/kendo-file-saver": "^1.0.4",
"@progress/kendo-popup-common": "^1.2.3",
"@progress/kendo-theme-default": "^2.44.0",
"@telerik/kendo-intl": "^1.3.0",
"angular2-notifications": "^0.9.6",
"classlist.js": "^1.1.20150312",
"core-js": "^2.5.1",
"intl": "^1.2.5",
"libphonenumber-js": "^0.4.40",
"rxjs": "5.5.2",
"web-animations-js": "^2.3.1",
"zone.js": "^0.8.18"
},
"devDependencies": {
"@angular/cli": "^1.5.0",
"@angular/compiler-cli": "^5.0.2",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.92",
"angular-in-memory-web-api": "^0.3.2",
"autoprefixer": "^6.5.3",
"cldr-data": "^31.0.2",
"codelyzer": "~2.0.0",
"css-loader": "^0.27.3",
"cssnano": "^3.10.0",
"exports-loader": "^0.6.3",
"file-loader": "^0.10.0",
"istanbul-instrumenter-loader": "^2.0.0",
"jasmine-core": "~2.5.2",
"jasmine-spec-reporter": "~3.2.0",
"json-loader": "^0.5.4",
"jszip": "^3.1.3",
"karma": "~1.4.1",
"karma-chrome-launcher": "~2.0.0",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^0.2.0",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-sourcemap-loader": "^0.3.7",
"less-loader": "^4.0.2",
"postcss-loader": "^1.3.3",
"postcss-url": "^5.1.2",
"protractor": "~5.1.0",
"raw-loader": "^0.5.1",
"rollup": "^0.43.0",
"rollup-plugin-commonjs": "^8.0.2",
"rollup-plugin-node-resolve": "^3.0.0",
"rollup-plugin-uglify": "^2.0.1",
"sass-loader": "^6.0.3",
"script-loader": "^0.7.0",
"source-map-loader": "^0.1.5",
"style-loader": "^0.13.1",
"stylus-loader": "^3.0.1",
"systemjs": "^0.20.19",
"systemjs-plugin-babel": "0.0.25",
"systemjs-plugin-json": "^0.3.0",
"ts-node": "~2.0.0",
"tslib": "^1.6.1",
"tslint": "~4.5.0",
"typescript": "2.6.1",
"url-loader": "^0.5.7",
"webpack-dev-server": "~2.4.2"
}
}
删除 node_modules 文件夹 & 运行 npm install
我终于想出了解决办法。我所做的是从 Visual Studio 中删除 Typescript 扩展（取消选中 "Get Tools and Features" 菜单中的 TypeScript 选项，并将其从 "Extensions and Updates) and then downloading and installing "TypeScript 2.6.1 for Visual Studio 2017 中删除”。我曾尝试只安装 "TypeScript 2.6.1 for Visual Studio 2017"，但那没有用。我的问题只能通过首先从 Visual Studio 2017 中删除 Typescript 如上所述然后安装 "TypeScript 2.6.1 for Visual Studio 2017" 来解决。在尝试任何这些之前，我确实按照 Melchia 的建议删除了 node_modules 目录，但它本身并没有工作，但也许首先这样做是修复的必要部分，尽管我不确定。如果删除 Typescript 然后安装它对你不起作用，你可以尝试删除 node_modules 目录和 运行 npm install。希望这对其他人有帮助。