将 Angular 5 更新为 6.rc0 会导致打包问题

Question

我目前正在尝试从 angular 5 更新到 6.rc0。我将包裹 json 更改为如下所示：

{
  "name": "angular5to6",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "6.0.0-rc.0",
    "@angular/cdk": "6.0.0-beta.5",
    "@angular/common": "6.0.0-rc.0",
    "@angular/compiler": "6.0.0-rc.0",
    "@angular/core": "6.0.0-rc.0",
    "@angular/forms": "6.0.0-rc.0",
    "@angular/http": "6.0.0-rc.0",
    "@angular/material": "6.0.0-beta.5",
    "@angular/platform-browser": "6.0.0-rc.0",
    "@angular/platform-browser-dynamic": "6.0.0-rc.0",
    "@angular/router": "6.0.0-rc.0",
    "core-js": "2.5.3",
    "material-design-icons": "^3.0.1",
    "roboto-fontface": "^0.9.0",
    "rxjs": "^5.6.0-forward-compat.2",
    "zone.js": "0.8.20"
  },
  "devDependencies": {
    "@angular/cli": "6.0.0-beta.6",
    "@angular/compiler-cli": "6.0.0-rc.0",
    "@angular/language-service": "6.0.0-rc.0",
    "@types/autobahn": "^0.9.38",
    "@types/jasmine": "~2.8.3",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "8.10.0",
    "autobahn": "^18.3.1",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.8.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~2.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~4.1.0",
    "tslint": "~5.9.1",
    "typescript": "2.7.2"
  }
}

我更新了所有依赖项并且 ng build 在更新到 node 8.10.0 后工作，当我打开浏览器并尝试运行构建时我遇到以下问题：

index.js:43 Uncaught ReferenceError: global is not defined
at Object.../node_modules/buffer/index.js (index.js:43)
at __webpack_require__ (bootstrap:74)
at Object.../node_modules/safe-buffer/index.js (index.js:2)
at __webpack_require__ (bootstrap:74)
at Object.../node_modules/msgpack5/index.js (index.js:3)
at __webpack_require__ (bootstrap:74)
at Object.../node_modules/autobahn/lib/autobahn.js (autobahn.js:22)
at __webpack_require__ (bootstrap:74)
at Object.../node_modules/autobahn/index.js (index.js:14)
at __webpack_require__ (bootstrap:74)

出于某种原因，webpack 似乎没有将所有内容呈现为浏览器兼容的代码。

[更新]

似乎有几个外部包损坏了。我只是不确定为什么。他们与angular无关！？在这种情况下，它是 msgpack5 包。

Answer 1

我找到了导致问题的原因。我给angular/cli project开了一个新的issue。我不得不从

降级

"@angular/cli": "6.0.0-beta.6"

到

"@angular/cli": "1.7.3"

就是这样！

[更新] 使用 polyfill

可以更新到带有高速公路的最新 CLI/angular 6

(window as any).global = window;
(window as any).process = window;
(window as any).Buffer = window;
(window as any).process.browser = true;
(window as any).process.version = '';
(window as any).process.versions = {node: false};

将 Angular 5 更新为 6.rc0 会导致打包问题

Updating Angular 5 to 6.rc0 causes packing issues

browser

msgpack

webpack

angular