运行以下建议的命令以从Angular 2升级到4：
npm install @angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}@latest typescript@latest --save
...我的应用程序启动，因为我得到所有绿色和“webpack编译成功”消息（见下文）：
** NG Live Development Server is running on http://localhost:4200 **
Hash: 323543f20rf93c6190621
Time: 47918ms
chunk {0} main.bundle.js, main.bundle.js.map (main) 1.55 MB {3} [initial] [rendered]
chunk {1} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 239 kB {4} [initial] [rendered]
chunk {2} styles.bundle.js, styles.bundle.js.map (styles) 87.4 kB {4} [initial] [rendered]
chunk {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 5.29 MB [initial] [rendered]
chunk {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]
webpack: Compiled successfully.
但是，加载到浏览器的所有内容都是空白屏幕。在控制台中，我现在看到了这些错误：
错误TypeError：无法设置未定义
的属性'addEventListener'zone.js：522未处理的Promise拒绝：无法设置undefined的属性'addEventListener';区域：;任务：Promise.then;值：TypeError：无法设置未定义的属性“addEventListener”
注意：在再次运行“npm install”之前，我还完全删除了我的node-modules文件夹。更新后，我的package.json看起来像这样：
{
"name": "cli-abc",
"version": "0.0.1",
"license": "MIT",
"angular-cli": {},
"scripts": {
"ng": "ng",
"build": "ng build",
"start": "ng serve --proxy-config proxy.conf.json",
"test": "ng test",
"pree2e": "webdriver-manager update --standalone false --gecko false",
"e2e": "protractor"
},
"private": true,
"dependencies": {
"@angular/animations": "^4.1.0",
"@angular/common": "^4.1.0",
"@angular/compiler": "^4.1.0",
"@angular/core": "^4.1.0",
"@angular/forms": "^4.1.0",
"@angular/http": "^4.1.0",
"@angular/material": "^2.0.0-beta.3",
"@angular/platform-browser": "^4.1.0",
"@angular/platform-browser-dynamic": "^4.1.0",
"@angular/platform-server": "^4.1.0",
"@angular/router": "^4.1.0",
"@ng-idle/core": "^2.0.0-beta.11",
"@ng-idle/keepalive": "^2.0.0-beta.11",
"@ngtools/webpack": "^1.3.1",
"@types/socket.io": "^1.4.29",
"@types/socket.io-client": "^1.4.29",
"angular-in-memory-web-api": "0.3.2",
"angular2-chartjs": "0.2.0",
"angular2-markdown": "^1.6.0",
"angular2-moment": "^1.3.3",
"ngx-perfect-scrollbar": "4.0.0",
"chart.js": "^2.5.0",
"core-js": "^2.4.1",
"mydatepicker": "^1.10.1",
"ngx-pagination": "3.0.0",
"rxjs": "^5.3.1",
"ts-helpers": "^1.1.2",
"zone.js": "0.8.9"
},
"devDependencies": {
"@angular/cli": "1.0.1",
"@angular/compiler-cli": "^4.1.0",
"@types/jasmine": "2.5.47",
"@types/node": "^7.0.15",
"codelyzer": "~3.0.1",
"jasmine-core": "2.6.1",
"jasmine-spec-reporter": "4.1.0",
"karma": "1.6.0",
"karma-chrome-launcher": "^2.1.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.1.0",
"karma-remap-istanbul": "^0.6.0",
"protractor": "~5.1.1",
"ts-node": "3.0.2",
"tslint": "^5.1.0",
"typescript": "~2.3.2"
}
}
我还经历过并有条不紊地更新了任何显示兼容性警告的package.json依赖项。所以在运行“ng serve”时我没有更多的警告。
此处增加的挑战是控制台错误消息完全模糊。它告诉我的是，我的<app></app>标记之间的错误是某处，也就是说，它可能是在应用中的任何地方。
这里可能出现的问题是什么，如果不清楚，我该如何开始缩小选项？