Menu
Do anyone know how to bundling the web component created with stencil using webpack. I have multiple stencil components and need to create a bundle so that i can use it in other projects.
314
Stencil provides a Webpack plugin that makes it easy to include web components that have been built using Stencil in your Webpack built application.
You can bundle your JavaScript using the CLI command by providing an entry file and output path. Webpack will automatically resolve all dependencies from import and require and bundle them into a single output together with your app's script.
Calling defineCustomElementsA component collection built with Stencil includes a main function that is used to load the components in the collection. That function is called defineCustomElements() and it needs to be called once during the bootstrapping of your application.
Ionic has developed a StencilPlugin for webpack, which allows to easily import components using the webpack bundler.
You may also be interested in this excellent article which explains in more details how to use the plugin.
133
The stencil build command normally bundles everything for you into the components.js file (or whatever your stencil config's namespace value is). So you shouldn't need to create your own bundle. If you are finding problems with the Stencil-built bundle, maybe have a look at https://stenciljs.com/docs/module-bundling.
45
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
