Import css bundle in-place in Vite lib mode.

Note that this plugin only works in conjunction with vite cssCodeSplit option.

Getting started

Install package

npm install -D vite-plugin-inject-css-bundle

yarn add -D vite-plugin-inject-css-bundle

pnpm add -D vite-plugin-inject-css-bundle

Add plugin to vite.config

// vite.config.ts
import injectCss from 'vite-plugin-inject-css-bundle'

export default defineConfig({
  plugins: [
    ...,
    injectCss(),
  ],
  ...
})

How it works

The plugin will then ensure any modular css, with the .module.css extension will automatically be injected into the output javascript, using the correct import statement.

import styles from './component.module.css'

↓↓↓

...
import './__assets__/component-13fa45.css'