如何使 webpack 排除 angular2 模块



我正在尝试制作一个简单的 Webpack 版本作为 Angular 2 5 分钟的快速入门教程。

由于让 Webpack 自动包含所需的所有模块可能会有问题,因此我"直接"包含来自 html 的供应商脚本,几乎就像教程一样,除了我不需要 system.js 进行 webpack 设置,所以我不包括它,但我确实需要 webpack 产生的"捆绑.js":

<body>
<my-app></my-app>
<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>
<script src="bundle.js"></script>
</body>

如果我在 webpack 中使用这个配置,我几乎达到了我的目标:

module.exports = {
  entry: './src/boot.ts',
  output: {
    filename: 'bundle.js'
  },
  devtool: 'source-map',
  resolve: {
    extensions: ['', '.ts', '.js']
  },
  module: {
    loaders: [
      { test: /.ts$/, exclude: [/angular2/], loader: 'ts-loader' }
    ],
    noParse: [/angular2/]
  }
};

如果没有noParse,webpack将包含223个模块,这本身就是应该的,但是由于某种奇怪的原因,这导致了一个有问题的巨大捆绑文件(见上面的链接)。使用 noParse,我几乎达到了我的目标,但不是完全,它仍然包含两个我不希望 webpack 包含的角度模块:

   [0] ./src/boot.ts 195 bytes {0} [built]
   [1] ./~/angular2/platform/browser.js 13.1 kB {0} [built]
   [2] ./src/myapp/components/myapp.ts 1.27 kB {0} [built]
   [3] ./~/angular2/core.js 4.54 kB {0} [built]

我不希望 webpack 包含任何 Angular 2 模块(因为我已经包含了它)。它被包括在内可能是因为我的两个自制模块使用这两个模块。但是我怎样才能让 webpack 忽略这些呢?我的noParse(或exclude)在这里没有帮助......

你看过IgnorePlugin https://webpack.github.io/docs/list-of-plugins.html#ignoreplugin 吗

你所说的可以通过做这样的事情来实现:

var webpack = require("webpack");
module.exports = {
  // ...
  plugins: [
    new webpack.IgnorePlugin(/angular2$/)
  ]
};

最新更新