Angular 4到5更新./node_modules/@angular/core/esm5/core.js中的警告

时间:2018-02-10 17:38:37

标签: angular webpack asp.net-core

我已根据此tutorial更新了Angular 4到5,之后我的构建在webpack上失败,并出现两个警告:

  WARNING in ./node_modules/@angular/core/esm5/core.js
      6553:15-36 Critical dependency: the request of a dependency is an expression
       @ ./node_modules/@angular/core/esm5/core.js
       @ ./ClientApp/boot.browser.ts
       @ multi event-source-polyfill webpack-hot-middleware/client?path=__webpack_hmr&dynamicPublicPath=true ./ClientApp/boot.browser.ts

  WARNING in ./node_modules/@angular/core/esm5/core.js
  6573:15-102 Critical dependency: the request of a dependency is an expression
   @ ./node_modules/@angular/core/esm5/core.js
   @ ./ClientApp/boot.browser.ts
   @ multi event-source-polyfill webpack-hot-middleware/client?path=__webpack_hmr&dynamicPublicPath=true ./ClientApp/boot.browser.ts

我经历了这个topic,但没有任何帮助(也许我想念一些东西)。这就是我的webpack.config.vendor.js插件的外观:

    plugins: [
        new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', Popper: 'popper.js' }), // Maps these identifiers to the jQuery package (because Bootstrap expects it to be a global variable)
        new webpack.ContextReplacementPlugin(/\@angular\b.*\b(bundles|linker)/, path.join(__dirname, './ClientApp')), // Workaround for https://github.com/angular/angular/issues/11580
        new webpack.ContextReplacementPlugin(/angular(\\|\/)core(\\|\/)@angular/, path.join(__dirname, './ClientApp')), // Workaround for https://github.com/angular/angular/issues/14898
        new webpack.IgnorePlugin(/^vertx$/) // Workaround for https://github.com/stefanpenner/es6-promise/issues/100
    ] 

我最初使用Angular模板和Visual Studio中的.NET Core API。

2 个答案:

答案 0 :(得分:2)

当您使用VS 2017现在附带的较新的Angular模板,并将Angular版本4升级到5.xx时,您需要运行以下命令以避免在编译时获得一些警告。

webpack --config webpack.config.vendor.js

在项目根目录下从命令提示符运行此命令将删除您在上面的OP中看到的警告。

这样做是重建 wwwroot / dist 文件夹中的 vendor.js 文件,以根据您安装的Angular(和其他)npm软件包进行更新。

答案 1 :(得分:2)

您在webpack文件的ContextReplacementPlugin中传递的表达式可能存在问题。

我更改了

来自

new webpack.ContextReplacementPlugin(
            /angular(\\|\/)core(\\|\/)@angular/,
            helpers.root('src'), 
            {}
        )

new webpack.ContextReplacementPlugin(
            /\@angular(\\|\/)core(\\|\/)(\@angular|esm5)/,
            helpers.root('src'),
            {}
        )

这对我有用。希望对您有所帮助:)