search

hood / vite-plugin-shadow-style

A Vite plugin to inject css styles into the shadow root of web components.
17 stars 3 forks source link

Feature request: Custom injection target #3

Open m44rten1 opened 8 months ago

m44rten1 commented 8 months ago

Hello,

First off, I'd like to express my appreciation for your work on the ShadowStyle plugin. However, I've encountered a scenario where being able to specify a custom injection target would greatly enhance its utility in my project.

My project involves lazy loading styles, and as a result, I don't inject them at the entry point. This leads to a need for more flexibility in terms of where the styles are injected. To address this, I propose adding an option to the ShadowStyle plugin that allows users to define a custom injection target.

Here's a rough idea of how this feature could be implemented:


...
plugins: [
  shadowStyle({ injectionTarget: 'my-injection-target' }),
],
...
hood commented 7 months ago

Hey, thank you for using the plug-in and providing this idea! What would the injection target refer to, in your example? A DOM node, or a placeholder string to swap with the actual output CSS?

m44rten1 commented 5 months ago

Hey! I see that my comment wasn't clear. my-injection-target would refer to a file-name. I believe that the plugin only allows 'entry' files, if I understand the isInjectionTarget method.

hood commented 2 months ago

Yes, isInjectionTarget currently scans for output files and returns true if the file has the isEntry flag set by Vite. We can definitely customise this behaviour and allow for custom definition of an entrypoint.