Настройте несколько точек входа, которые создали несколько файлов в angular.json

Question

Ранее я работал над angular 5 с веб-пакетом, где веб-пакет поддерживает несколько точек входа, которые создали несколько файлов

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

Ссылка на ссылку: https://v5.angular.io/guide/webpack

Однако теперь я начал работать над угловой 7, в которой есть CLI. Я не нахожу способ справиться с этим в угловых условиях. Как лучше разбивать файлы на куски? Должны ли мы пойти дальше и использовать webpack вместо cli или это можно сделать с помощью CLI? Любая помощь с благодарностью.

Answer 1

Если вы хотите создать чанки модулей каждого узла в поставщике js, вы можете просто настроить их в webpack.config.js, как показано ниже:

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

Answer 2

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 и т. Д.