Question

之前我曾使用webpack处理angular 5，其中webpack支持创建多个文件的多个入口点

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

引用链接：https://v5.angular.io/guide/webpack

但是，现在我开始使用带有CLI的angular 7。我没有找到一种可以在角度cli中处理的方法。将文件拆分为块的更好方法是什么？我们应该继续使用webpack而不是cli还是可以使用CLI来完成？任何帮助将不胜感激。

Answer 1

Angular CLI是围绕一些默认Webpack设置（以及其他设置）的不错的包装。默认情况下，ng build将创建以下JS文件：

main.js
polyfills.js
runtime.js
styles.js
vendor.js

（如果您使用"outputHashing": "all"配置了这些文件的文件名，这些文件可能带有一个哈希后缀，这是生产的默认设置）

此外，如果您对要素模块利用延迟加载。 Angular CLI可能会将app.js分成名为1.chunk.js，2.chunk.js等的大块。

Answer 2

如果要在供应商js中创建每个节点模块的块，则只需在webpack.config.js中进行配置，如下所示：

module.exports = {
  //...
  optimization: {
    splitChunks: {
      cacheGroups: {
        commons: {
          test: /[\\/]node_modules[\\/]/,
          name: 'vendors',
          chunks: 'all'
        }
      }
    }
  }
};

配置多个入口点，以便在angular.json

2 个答案: