今天早上我一直在将我的Angular RC 5应用程序更新到RC 6.在修复了代码中的一些问题之后我已经构建了代码,但是当应用程序正在被引导时我似乎有错误。 (我不确定这一点,这只是我的怀疑)。
从研究中我发现它似乎是与webpack和@angular/upgrade
相关的问题。 (参见:https://github.com/angular/angular/issues/11249)。除此之外我没有找到很多信息,所以我希望有人遇到过类似的问题。
目前在控制台中我看到以下错误:
Uncaught SyntaxError: Unexpected token export
Uncaught TypeError: Cannot read property 'call' of undefined
当我浏览代码以查看失败的位置时,我注意到Uncaught SyntaxError: Unexpected token export
错误来自index.js
文件,index.js
文件是@angular/upgrade
文件1}}。在上面的链接中,提到@angular/upgrade
没有指向正确的“UMD包”。说实话,我不确定这是什么意思,我不知道如何解决这个问题。
@angular/update
index.js
的package.json
{
"name": "ui-prototype",
"version": "1.0.0",
"scripts": {
"start": "webpack-dev-server --inline --progress --profile --bail --port 8581",
"lite": "lite-server",
"build:dev": "rimraf dist && webpack --config config/webpack.dev.js --progress --profile --bail",
"build:prod": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail",
"postinstall": "typings install",
"tsc": "tsc",
"tsc:w": "tsc -w",
"typings": "typings",
"test": "gulp test",
"watch": "gulp tdd",
"test:karma": "karma start",
"watch:karma": "npm run test:karma -- --auto-watch --no-single-run",
"e2e": "npm run protractor",
"e2e:live": "npm run e2e -- --elementExplorer",
"lint": "gulp tslint",
"tslint": "tslint -c tslint.json src/**/*.ts",
"protractor": "protractor",
"pree2e": "npm run webdriver:update -- --standalone",
"ci": "npm run lint && npm test && npm run e2e",
"webdriver-manager": "webdriver-manager",
"webdriver:update": "npm run webdriver-manager update",
"webdriver:start": "npm run webdriver-manager start"
},
"dependencies": {
"@angular/common": "2.0.0-rc.6",
"@angular/compiler": "2.0.0-rc.6",
"@angular/core": "2.0.0-rc.6",
"@angular/forms": "2.0.0-rc.6",
"@angular/http": "2.0.0-rc.6",
"@angular/platform-browser": "2.0.0-rc.6",
"@angular/platform-browser-dynamic": "2.0.0-rc.6",
"@angular/router": "3.0.0-rc.2",
"@angular/router-deprecated": "2.0.0-rc.2",
"@angular/upgrade": "2.0.0-rc.6",
"angular2-in-memory-web-api": "0.0.18",
"angular2-jwt": "^0.1.16",
"es6-shim": "^0.35.0",
"jquery": "^2.2.4",
"ng2-cookies": "^0.1.9",
"ts-node": "^0.9.3",
"primeng": "1.0.0-beta.14",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.11",
"core-js": "^2.4.0",
"zone.js": "^0.6.17"
},
"devDependencies": {
"ts-promise": "^0.3.0",
"codelyzer": "0.0.22",
"concurrently": "^2.0.0",
"css-loader": "^0.23.1",
"extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.9.0",
"gulp": "^3.9.1",
"gulp-tslint": "^5.0.0",
"html-loader": "^0.4.3",
"html-webpack-plugin": "^2.22.0",
"jasmine-core": "^2.4.1",
"karma": "^1.1.0",
"karma-chrome-launcher": "^1.0.1",
"karma-coverage": "^1.0.0",
"karma-firefox-launcher": "^1.0.0",
"karma-html-reporter": "^0.2.7",
"karma-jasmine": "^1.0.2",
"karma-phantomjs-launcher": "^1.0.0",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "^1.7.0",
"lite-server": "^2.2.0",
"null-loader": "^0.1.1",
"phantomjs-prebuilt": "^2.1.7",
"protractor": "^3.2.2",
"raw-loader": "^0.5.1",
"rimraf": "^2.5.2",
"style-loader": "^0.13.1",
"ts-loader": "^0.8.1",
"tslint": "^3.10.2",
"tslint-loader": "^2.1.4",
"typescript": "^1.8.10",
"typings": "^1.3.1",
"webpack": "^1.13.1",
"webpack-dev-server": "^1.14.1",
"webpack-merge": "^0.14.0"
}
}
main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { AppModule } from './app/app.module';
if (process.env.ENV === 'production') {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule);
更新:发现问题的来源
所以我一直在寻找解决问题的方法,然后我又回到了上面附带的链接。那里有一个标记的提交链接到同一个问题。 (参见:https://github.com/angular/angular/commit/979657989bab4fb93faf6a207d30760faa9bd696)。一旦我查看了那里的更新,我就意识到必须要做什么。
问题是package.json
包的@angular/upgrade
指向错误的UMD文件。
@angular/upgrade
package.json
{
"_args": [
[
{
"raw": "@angular/upgrade@2.0.0-rc.6",
"scope": "@angular",
"escapedName": "@angular%2fupgrade",
"name": "@angular/upgrade",
"rawSpec": "2.0.0-rc.6",
"spec": "2.0.0-rc.6",
"type": "version"
},
"c:\\xampp\\htdocs\\yii\\application\\prototype\\branches\\INT-81_RD\\ng-app"
]
],
"_from": "@angular/upgrade@2.0.0-rc.6",
"_id": "@angular/upgrade@2.0.0-rc.6",
"_inCache": true,
"_installable": true,
"_location": "/@angular/upgrade",
"_nodeVersion": "5.4.1",
"_npmOperationalInternal": {
"host": "packages-12-west.internal.npmjs.com",
"tmp": "tmp/upgrade-2.0.0-rc.6.tgz_1472686652636_0.8626930271275342"
},
"_npmUser": {
"name": "angular",
"email": "angular-core+npm@google.com"
},
"_npmVersion": "3.9.2",
"_phantomChildren": {},
"_requested": {
"raw": "@angular/upgrade@2.0.0-rc.6",
"scope": "@angular",
"escapedName": "@angular%2fupgrade",
"name": "@angular/upgrade",
"rawSpec": "2.0.0-rc.6",
"spec": "2.0.0-rc.6",
"type": "version"
},
"_requiredBy": [
"/"
],
"_resolved": "https://registry.npmjs.org/@angular/upgrade/-/upgrade-2.0.0-rc.6.tgz",
"_shasum": "3757ab3607cf5b09ef47d98ea4bb5bf5cffeab53",
"_shrinkwrap": null,
"_spec": "@angular/upgrade@2.0.0-rc.6",
"_where": "c:\\xampp\\htdocs\\yii\\application\\prototype\\branches\\INT-81_RD\\ng-app",
"author": {
"name": "angular"
},
"bugs": {
"url": "https://github.com/angular/angular/issues"
},
"dependencies": {},
"description": "",
"devDependencies": {},
"directories": {},
"dist": {
"shasum": "3757ab3607cf5b09ef47d98ea4bb5bf5cffeab53",
"tarball": "https://registry.npmjs.org/@angular/upgrade/-/upgrade-2.0.0-rc.6.tgz"
},
"homepage": "https://github.com/angular/angular#readme",
"license": "MIT",
"main": "bundles/core.umd.js",
"maintainers": [
{
"name": "angular",
"email": "angular-core+npm@google.com"
}
],
"module": "index.js",
"name": "@angular/upgrade",
"optionalDependencies": {},
"peerDependencies": {
"@angular/core": "^2.0.0-rc.6",
"@angular/compiler": "^2.0.0-rc.6",
"@angular/platform-browser": "^2.0.0-rc.6",
"@angular/platform-browser-dynamic": "^2.0.0-rc.6"
},
"readme": "ERROR: No README data found!",
"repository": {
"type": "git",
"url": "git+https://github.com/angular/angular.git"
},
"scripts": {},
"typings": "index.d.ts",
"version": "2.0.0-rc.6"
}
你会注意到上面有一个"main": "bundles/core.umd.js"
。
这应该更新为"main": "bundles/upgrade.umd.js"
。
我猜这是包装本身的某种错误?可能它将在不久的将来得到修复。现在我不得不手动更改它以修复它。