当我试图将我的angular项目升级到Webpack 2时，我得到了"Uncaught -metadata shim“。

Question

我有一个“Webpack 1”项目，运行得很好。我想升级到Webpack 2.x，所以我在我的package.json中将以下内容从

"webpack": "^1.13.3", "webpack-merge": "^2.0.0"

至

"webpack": "^2", "webpack-merge": "^3.0.0"

我更新了我的webpack文件per this link。一切正常，我得到了我想要的工件。我的pollyfills.ts看起来像这样。

...
import 'reflect-metadata'
import 'core-js/es6/typed';
import 'core-js/es6/reflect';
import "core-js/es7/reflect";
import "zone.js/dist/zone";
...

我还尝试将以下代码添加到我的主文件中

import 'reflect-metadata'

但是当我尝试运行的时候，我得到了下面的错误Uncaught reflect-metadata shim is required when using class decorators。我用的是....

"@angular/common": "^2.4.1",
"@angular/compiler": "^2.4.1",
"@angular/core": "^2.4.1",

有人能帮我补上我错过的东西吗？如果我恢复到老的webpack，它工作得很好。

Answer 1

我正在使用VS-Code和Angular CLI。今天，我在我的控制台上遇到了完全相同的错误。

在我的例子中，我只需要重新启动VS-Code编辑器。启动编辑器后，我在项目文件夹中运行"ng serve“，一切正常，没有任何错误。

我希望它能帮上忙。

Answer 2

我的回答显然与其他人相似。在此之前，我的Webpack配置是这样的…

entry: {
  polyfills: './conf/polyfills',
  vendor: './conf/deps',
  app: './src/ng2/main',
},

你显然不能再这样做了(有人能找到证据吗？)这可能要归功于“Webpack 2”所实施的某种隔离。所以我把这个改成..。

entry: {
  app: './src/ng2/main'
},

在我的main.ts的顶部，我添加了以下内容(在我的例子中还移动了文件之后)……

import './polyfills'
import './deps'

现在它似乎起作用了。