我正在尝试使用 Angular 为 Liferay 创建客户端扩展，但在部署扩展后，它显示为空白屏幕。以下是我遵循的步骤：
我采取的步骤：
创建Liferay工作区：
我创建了一个liferay-workspace，并在工作区内添加了一个 client-extensions 文件夹。
创建 Angular 项目：
- 在 client-extensions 文件夹中，我使用 ng new 创建了一个 Angular 项目。我使用的 Angular 版本是 14。
我对 Angular 项目做了一些更改：
- 创建 client-extension.yaml 文件
assemble:
- from: build/static
into: static
sample-page:
cssURLs:
- styles.*.css
friendlyURLMapping: sample-page
htmlElementName: sample-page
instanceable: false
name: My Sample Page
portletCategoryName: category.client-extensions
type: customElement
urls:
- main.*.js
- polyfills.*.js
- runtime.*.js
useESM: true
- 更新了 app.component.ts 中的 app-root 标签以匹配来自客户端扩展 YAML（sample-about-page）的自定义元素名称。
应用程序.组件.ts
@Component({
selector: 'sample-page',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
- 更新了 index.html 中的根元素以使用 。添加了必要的 client-extension.yaml 文件来配置扩展。
索引.html
<body>
<sample-page></sample-page>
</body>
建设项目：
从工作区根目录，我运行了./gradlew build，它创建了 dist 和 build 文件夹，并生成了 Angular 项目的 ZIP 文件。
部署到liferay：
- 我将生成的 ZIP 文件复制到liferay-portal/osgi/client-extensions文件夹中。
- 我通过导航到liferay-portal/tomcat/bin并运行命令启动了 Liferay 服务器
sh startup.sh。 - Liferay 服务器在 localhost:8080 上启动。
- 我在控制面板（控制面板>客户端扩展）中验证了客户端扩展，并且该扩展已列在那里。
- 在主页上，我点击了铅笔（钢笔图标），在小部件列表中找到了扩展程序。将扩展程序拖放到屏幕上后，它显示为空白屏幕。
问题：Angular 客户端扩展出现在 Liferay 的小部件部分，可以拖到页面上，但小部件本身在页面上呈现时是空白的。
附加信息：
- client-extension.yaml 文件配置了正确的 htmlElementName (sample-page)。
- index.html 中的根元素已更新为使用 。
- 我没有使用 Angular 路由，所有代码都放在 app.component.html 里面。
可能出现什么问题？
如果您能提供任何见解或建议，说明部署后客户端扩展显示为空白屏幕的原因，我将不胜感激。在将 Angular 客户端扩展与 Liferay 集成时，我是否可能错过了其他配置或步骤？
