如何将角元素与"ng g库“方法相结合？
如您所知，"ng g库“方法帮助我们创建可重用组件的库。但如果我想把这些组件编译成网络组件.通过角度元素的支撑？不仅如此，库中的每个组件都将被编译到自己的文件夹或JS文件中。如何配置一个可以让我实现这一目标的dev环境？
例如：
如果我创建一个lib并添加一个自定义组件，我知道我可以编译它，生成一系列文件夹，例如esm5、esm2015、fesm5等等。现在的问题是:我如何将30个自定义组件添加到我的库中，然后当我编译时，它将为每个文件夹创建一个包含Web组件版本的文件夹.好像角元素通过我的组件库生成了每个组件的Web组件版本。
如下所示：
lib/
lib/custom/comp1
lib/custom/comp2
lib/custom/comp3
lib/custom/comp4变成类似于：
Dist/
Dist/custom/
Dist/custom/bundle
Dist/custom/esm5
Dist/custom/esm2015
Dist/custom/comp1_web_independend_component_version
Dist/custom/comp2_web_independend_component_version
Dist/custom/comp3_web_independend_component_version
Dist/custom/comp4_web_independend_component_version我发现的最接近的解决方案是：
https://medium.com/@rahulsahay19/running-multiple-angular-elements-on-the-same-page-5949dac5523
我还请求角CLI小组在这方面提供帮助：
回答 1
Stack Overflow用户
发布于 2019-04-03 16:31:50
ng build内部使用webpack来做建筑。这个问题实际上分为两部分。
- 没有
ng eject，如何访问内部webpackConfig并根据我们的需要定制它。 - 对于这个用例，所需的webpackConfig是什么样子的？
对于第1部分，有一个解决方案@角-建筑商/自定义-webpack。基本上，它允许您将一些额外的字段合并到内部的webpackConfig中，并且仍然使用正式的“@ and / builder :browser”作为构建器。
现在，对于第2部分，您的用例只是webpack中的一个多条目多输出构建问题。解决办法是很直接的。
const partialWebpackConfig = {
entry: {
'custom/comp1': '/path/to/src/lib/custom/comp1.ts',
'custom/comp2': '/path/to/src/lib/custom/comp2.ts',
},
output: {
path: path.resolve(__dirname, 'Dist'),
filename: '[name].js'
}
}下面是一个逐步设置此配置的指令.
npm install @angular-builders/custom-webpack- 在项目根目录中创建一个
webpack.config.js：
const path = require('path');
module.exports = {
entry: {
'custom/comp1': path.resolve(__dirname, 'src/lib/custom/comp1.ts'),
'custom/comp2': path.resolve(__dirname, 'src/lib/custom/comp2.ts')
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].js'
}
}- 在architect.build中编辑“
angular.json”字段
{
// ...
"architect": {
"build": {
"builder": "@angular-builders/custom-webpack:browser",
"options": {
"customWebpackConfig": {
"path": "./webpack.config.js",
},
// ...- 运行
ng build，应该会看到结果。
为了提前使用，值得一提的是，@angular-builders/custom-webpack支持导出webpack配置作为一个函数以获得最终使用的webpackConfig的完全控制。
https://stackoverflow.com/questions/55342696
复制相似问题
腾讯云开发者
