警告:关键依赖项中使用 require 函数的方式无法静态提取其依赖项。

3

将我的webpack升级到webpack2后,控制台中出现了一些警告:

WARNING in ./~/reflect-metadata/Reflect.js
841:28 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

Here's my code:

package.json:

{
  "name": "myApp",
  "version": "1.0.0",
  "description": "myApp",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "typings": "typings",
    "start": "webpack-dev-server --inline --progress --port 3000"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@angular/common": "2.0.0-rc.4",
    "@angular/compiler": "2.0.0-rc.4",
    "@angular/core": "2.0.0-rc.4",
    "@angular/forms": "0.2.0",
    "@angular/http": "2.0.0-rc.4",
    "@angular/platform-browser": "2.0.0-rc.4",
    "@angular/platform-browser-dynamic": "2.0.0-rc.4",
    "@angular/router": "3.0.0-beta.1",
    "@angular/router-deprecated": "2.0.0-rc.2",
    "@angular/upgrade": "2.0.0-rc.4",
    "angular2-in-memory-web-api": "0.0.14",
    "angular2-template-loader": "^0.4.0",
    "core-js": "^2.4.1",
    "html-loader": "^0.4.3",
    "html-webpack-plugin": "^2.22.0",
    "reflect-metadata": "^0.1.4",
    "rxjs": "^5.0.0-beta.6",
    "ts-loader": "^0.8.2",
    "typescript": "^1.8.10",
    "typings": "^1.3.2",
    "webpack": "^2.1.0-beta.20",
    "webpack-dev-middleware": "^1.6.1",
    "webpack-dev-server": "^2.1.0-beta.0",
    "webpack-merge": "^0.14.1",
    "zone.js": "^0.6.12"
  },
  "devDependencies": {
    "concurrently": "^2.0.0"
  }
}

webpack.config.js

var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {

  entry: {
    'polyfills': './src/polyfills.ts',
    'vendor': './src/vendor.ts',
    'app': './src/app.ts'
  },

  output: {
    filename: '[name].js'
  },

  resolve: {
    extensions: ['', '.js', '.ts']
  },

  module: {
    loaders: [
      {
        test: /\.ts$/,
        loaders: ['ts', 'angular2-template-loader']
      },
      {
        test: /\.html$/,
        loader: 'html'
      },
    ]
  },

  plugins: [

    new webpack.optimize.CommonsChunkPlugin({
      name: ['app', 'vendor', 'polyfills']
    }),

    new HtmlWebpackPlugin({
      template: './src/index.html'
    })
  ],

  devServer: {
    historyApiFallback: true,
    stats: 'minimal'
  }
  
}

polyfills.ts

require('zone.js/dist/zone');
import 'core-js/es6';
import 'reflect-metadata';


if (process.env.ENV === 'production') {
  // Production
} else {
  // Development
  Error['stackTraceLimit'] = Infinity;
  require('zone.js/dist/long-stack-trace-zone');
}

vendor.ts

// Angular 2
import '@angular/platform-browser';
import '@angular/platform-browser-dynamic';
import '@angular/core';
import '@angular/common';
import '@angular/http';
import '@angular/router';

// RxJS
import 'rxjs';

// Other vendors for example jQuery, Lodash or Bootstrap
// You can import js, ts, css, sass, ...

app.ts

import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { AppComponent } from './app/app.component';

if (process.env.ENV === 'production') {
  enableProdMode();
}

bootstrap(AppComponent, []);

有人知道这些警告是什么意思吗?当运行应用程序时一切正常,只有这些警告。

谢谢!


polyfill.tsif 语句内的 require 看起来可能会引起警告。理论上,编译器可能能够在编译时计算出 process.env.ENV === 'production' 的结果,但如果它不能计算出来,我也不会感到惊讶。 - mrmcgreg
1个回答

2

我在使用reflect-metadata 0.1.4时也遇到了相同的警告。将版本降级至0.1.3后,警告消失了。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接