自定义元素未在另一个角度应用程序中加载答案

【问题标题】：Custom elements are not loading in anpother angular app自定义元素未在另一个角度应用程序中加载
【发布时间】：2021-07-08 03:32:15
【问题描述】：

我在一个项目中创建了简单的 angular 自定义元素，并使用 npx-build-plus 创建了捆绑包，并生成了如下图所示的文件，

我从这些文件中取出了 main.js 文件。我创建了另一个 Angular cli 项目，并将生成的 js 文件包含在根文件夹中，如下所示

在 index.html 中我是这样使用的

   <!doctype html>
<html lang="en">
<head>
  <title>Custom Angular Element</title>
</head>
<body>
<script src="elements/main.f23021e9a099929ed5cb.js"></script>
<h1 id="result" style="text-align: center"> Angular elements !!!</h1>
<value-button text="Value Button" value="1"></value-button>
</body>
</html>

但该元素没有显示。我也尝试提供应用程序组件 html，但也没有在那里工作

我应该在 package.json 中进行任何配置吗？你能帮帮我吗？

【问题讨论】：

标签： javascript html angular angular-elements

【解决方案1】：

您可以尝试关注这篇文章https://medium.com/swlh/build-micro-frontends-using-angular-elements-the-beginners-guide-75ffeae61b58

另外，如果尝试在没有哈希的情况下构建它，以便始终易于阅读。另外，您应该在 index.html 中添加自定义元素（例如）。

这篇文章更详细地讨论了这些设置。

【讨论】：