parcel-bundler / parcel

The zero configuration build tool for the web. 📦🚀
https://parceljs.org
MIT License
43.39k stars 2.27k forks source link

Append Code Splitting CSS bundles inside Shadow DOM instead of Document Head #6045

Open JohnDeved opened 3 years ago

JohnDeved commented 3 years ago

🙋 feature request

it would be useful for applications using WebComponents (shadow dom) to import the CSS from async import inside a different container, a custom shadow root location. If the CSS is included in Head instead of the shadow root, this will cause the CSS to leak to other components & cause conflicts.

followup issue from #6044

😯 Current Behavior

CSS just gets loaded into Document Head by the css-loader

💁 Possible Solution

allow defining a document.querySelector query inside package.json to be used for css-loader appendChild

mischnic commented 3 years ago

Does importing the CSS bundle as a string via bundle-text: work in your situation? https://v2.parceljs.org/configuration/plugin-configuration/#predefined-(offical)-named-pipelines

JohnDeved commented 3 years ago

not in my use case, but its good to know this is possible