问题标签 [stenciljs]

我正在使用 Stencil 创建一个使用阴影进行视图封装的本机浏览器 Web 组件。

如果在我的 SCSS 文件的顶部我使用

这会让每个组件重新下载每个组件实例的字体/图标文件，从而对性能产生负面影响吗？

如果是这样，处理这种共享依赖的最佳实践是什么？

我想知道是否可以创建一个all-in-one.js包含所有组件的包，因此不需要加载其他脚本标签。

我的配置：

如何配置 baseUrl 的outputTarget类型dist？此选项似乎只适用于 type of www，但在我的 Network 面板中查看，仍然从特定的 url 加载源：

...看起来我没有配置/assets/js零件的选项。

模板.config.js

我试图了解自定义事件发射器的流程。我有滚动代码，鼠标事件可以在其中工作，但自定义事件没有。通过开发工具跟踪它，它正在发射但没有被听众拾取。

顶级组件在这里：

组件在这里：

最后 index.html 在这里：

你能建议为什么 stateChanged 事件没有被注意到my-component吗？

我正在尝试在特定的 DOM 节点内引导一个 Angular 2+ 应用程序（准确地说是 6 个）。我想在 Web 组件中执行此操作my-component（使用StencilJS编写）。

理想情况下，我可以使用选择器或 HTMLElement 从 Web 组件的根元素引导。

然而，问题是 Angular 在页面上被“全局”实例化，因此试图将所有标签解释为 Angular 组件——而不仅仅是在我自己的 Web 组件中找到的那些：

我尝试了在网上找到的 3 种不同的方法。然而，他们中的许多人仍然使用.bootstrap在较新的 Angular 版本中不再可用的方法。其他人只是在某个节点中实例化组件，而不是整个应用程序。

NgDoBootstrap似乎是一种很有前途的方法，但它也会导致 Angular 解析页面上的所有组件。

我创建了一个 repo 来调查这个问题。任何帮助，将不胜感激。

https://github.com/bitflower/ng-stencil

我正在尝试将 JSON 字符串传递给我的组件道具，并让组件将字符串解析为 javascript 对象。

不幸的是，@Watch 装饰器没有触发……我做错了什么？我遵循了这个文档：https ://stenciljs.com/docs/reactive-data#watch-decorator

以下是我的代码的相关部分：

ptw-input.tsx

索引.html

...这是我的package.json

我正在使用最新的 stenciljs，如 package.json 中所示，但控制台日志中除了此错误之外没有任何内容：TypeError: Cannot read property 'placeholder' of undefined

有人可以指导我吗？是否可以Stencil.js将自定义属性/指令（如 Aurelia/Angular）添加到现有元素？

我在他们的网站上找不到任何关于此的文档。仅创建一个新组件与扩展现有元素无关。

我想在Stencil.jsdiv中添加自定义属性或任何 HTML 元素是否可以？

我正在努力让 Visual Studio Code 调试器与 Jest 测试一起工作。

这是我的launch.json：

这是我的带有几个断点的 Jest 测试：

当我点击绿色播放按钮以使用调试器运行测试时，断点永远不会被命中。

任何帮助，将不胜感激

我的一般问题是，我如何在另一个模板组件中使用模板构建的组件。不在 PWA 工具包中，而是在另一个组件中。

更具体地说，我要使用的组件不在 npm 上，而是在私有 bitbucket 存储库上。在其 package.json 中有准备脚本 ( "prepare":"stencil build")。然后我使用 git 链接将该组件添加到 package.json 中的父组件。当我运行时，它从 bitbucket 中获取组件并使用脚本npm install child-component构建它。prepare这工作正常。但是如何添加要加载/渲染的组件？

是否可以设置一个可以具有多个相互独立的 Web 组件的 StencilJS 项目？

截至目前，我可以看到有 2 个种子项目可分别用于开发组件和应用程序。

我有一个用例，我们想在一个地方管理所有组件。我们希望生成/构建独立的组件脚本，但不希望每个组件都有多个 package.json 和构建过程。