将 Angular 元素捆绑到一个文件中

Question

我正在构建一个带有Angular 元素（版本 13）的 Web 组件，我有一个关于捆绑的问题。

是否有可能以所有 js 包（main.js、runtime.js 和 polyfills.js）和 css 和 ZAE8EB96DF05E788AC39D88948EAF2 文件夹中的 5 个单个CZjs 图标的方式构建 Web 组件在最后？

我现在正在做的是运行ng build --configuration element --output-hashing none && node build.js其中 build.js 包括：

const fs = require('fs-extra');
const concat = require('concat');

(async function build() {
  const files = [
    './dist/runtime.js',
    './dist/polyfills.js',
    './dist/main.js'
  ];

  await concat(files, './dist/webcomp-ecar-friendly-accommodations.min.js');
  await fs.remove('./dist/runtime.js')
  await fs.remove('./dist/polyfills.js')
  await fs.remove('./dist/main.js')
})();

有没有办法将 css 文件和 /assets 捆绑在同一个 js 包中？ 我知道它是在其他应用程序中使用 Webpack 完成的，但我不确定如何使用 Angular CLI 来做到这一点。

任何输入将不胜感激！

Answer 1

我建议你调查一下。 ngx-build-plus https://www.npmjs.com/package/ngx-build-plus