Stencil: allow using webpack instead of rollup
Stencil version:
@stencil/*
I'm submitting a:
[ ] bug report
[ X] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://stencil-worldwide.herokuapp.com/ or https://forum.ionicframework.com/
I would like to request a stencil webpack plugin, that will allow us to use it instead of the current rollup configuration.
Of course, I would like to help with the implementation if this feature decision would ever be approved.
The decision of the ionic team to use rollup have created an infinite amount of errors that cannot be fixed - most of them are closed or go unanswered since no one has a proper fix for them - it's a shame, stencil could be one of the best webcomponents frameworks/compilers in the market, but when older UMD imports or symlinks are breaking the build, I think most people would rather run away to angular-elements or polymer or svelte-custom-elements.
I currently face issues that have arisen after months of working with stencil, but there is no way to go around them since they are issues with rollup - that is my reason to leave stencil, and I would gladly return to using it if there was support for webpack.
liron-navon
All 9 comments
Did you check ionic/angular ionic/react and vue and how it integrates to be compatible with different bundles? Can you elaborate about issues you have when bundling!?
romulocintra
on 10 Jul 2019
Are the problems you are experimenting any of the ones documented here: https://stenciljs.com/docs/module-bundling ?
or something different.
Stencil uses rollup not only because it's faster, actually treeshake and generates human-readable JS, but because it's future-proof. Rollup works only with standard ESM, commonjs is handled by a plugin. Webpack instead is built in the own ecosystem that does not even support ESM (all modern browsers do today), and ships massive amounts of boilerplate to bundle even the simpler stuff.
We should lobby library authors to ship their libraries in ESM (since it's trivial to transpile to commonjs (if needed), but the same it's not true from commonjs to ESM, given the sync and dynamic nature of this module format.
Specific issues might be solvable in the commonjs plugin of rollup, and we are working in a better rollup-plugin-node-polyfills, that work much better than the builtins and globals plugin. We will focus our efforts to make rollup work better with shitty libraries than move everything to a worse bundler just because of this problematic dependencies, that could be fixed.
manucorporat
on 11 Jul 2019
leaving issue open to keep conversation open :)
manucorporat
on 11 Jul 2019
@manucorporat
This is my number one issue with stencil, and I have found no solution, and no one gave me an answer to it, and other people seem to have the same issue, I opened it a while ago and got no response from the team tho...
liron-navon
on 11 Jul 2019
@liron-navon Just by curiosity, why don't you use Svelte for custom elements or something else?
lcswillems
on 16 Jul 2019
We will focus our efforts to make rollup work better with shitty libraries than move everything to a worse bundler just because of this problematic dependencies, that could be fixed.
@manucorporat would this perhaps fix other npm modules such as the es6-tween? I have an open bug regarding an issue where the es6-tween module doesn't import properly even though their package.json defines a "module"
Matthew-Smith
on 17 Jul 2019
@lcswillems cause svelte is not made to generate web components (I know they added it, but if it's not documented I won't use it) and I hate it's templating style - I could have written it in angular-elements or vue-webcomponents, but I like stencil and I want to keep working with it.
liron-navon
on 17 Jul 2019
Okay, interesting opinion! Thanks for sharing it!
lcswillems
on 17 Jul 2019
Rollup is getting better and better, recently handling commonjs deps much better, webpack is bloated and custom, while rollup focus in following the ESM spec, we believe this is a good investment in the long run. We will not support webpack.
manucorporat
on 6 May 2020
Related issues
bekliev
路
3Comments
elmariofredo
路
3Comments
karsvaniersel
路
3Comments
noahlaux
路
3Comments
guidoknoll
路
3Comments
Most helpful comment
Are the problems you are experimenting any of the ones documented here: https://stenciljs.com/docs/module-bundling ?
or something different.
Stencil uses rollup not only because it's faster, actually treeshake and generates human-readable JS, but because it's future-proof. Rollup works only with standard ESM, commonjs is handled by a plugin. Webpack instead is built in the own ecosystem that does not even support ESM (all modern browsers do today), and ships massive amounts of boilerplate to bundle even the simpler stuff.
We should lobby library authors to ship their libraries in ESM (since it's trivial to transpile to commonjs (if needed), but the same it's not true from commonjs to ESM, given the sync and dynamic nature of this module format.
Specific issues might be solvable in the commonjs plugin of rollup, and we are working in a better rollup-plugin-node-polyfills, that work much better than the builtins and globals plugin. We will focus our efforts to make rollup work better with shitty libraries than move everything to a worse bundler just because of this problematic dependencies, that could be fixed.