Plugin + Vite library build drops CSS (styles not applied in consumer)

[Vheissu]

Summary

When generating an Aurelia 2 plugin project with Vite, the library build emits CSS as a separate file and removes CSS imports from the JS bundle. Consumers who import only the plugin JS miss component styles,
and Shadow DOM shared styles also become tricky because ?inline CSS isn’t part of the library output by default.

This makes plugin+Vite output behave differently than webpack plugin output, and is likely why plugin+Vite is currently gated in the CLI.

Repro

1. Scaffold a plugin with Vite:

npx makes aurelia my-plugin -s plugin,vite,typescript,css

2. Build:

npm run build

3. Inspect dist/index.js (or the ESM output). The CSS isn’t injected or referenced; a separate CSS asset is emitted.

Expected

• Plugin JS bundle should include or apply styles automatically (similar to webpack plugin build), or
• The template/tooling should document that consumers must import the generated CSS file.

Actual

• CSS is emitted separately and not referenced by the JS bundle.
• Consumers importing only the plugin JS do not get styles.

Impact

• Plugin components render without styling by default.
• Shadow DOM/shared styles require extra manual wiring.
• Plugin+Vite is currently unsuitable as the default plugin template.

Possible fixes

• Inject CSS into the plugin JS bundle on build (e.g., Vite/Rollup plugin).
• Document CSS import requirements for consumers.
• Provide a CLI option or template convention that avoids the foot‑gun.

[3cp]

That's exactly when plugin setup still uses webpack.

Ask consumers to load css for plugin might not be bad idea. Most frameworks' plugins do that.

I would love to drop webpack from our skeleton altogether :) Parcel seems losing popularity too. Maybe we just support vite in official skeletons?