unplugin-lightningcss
Lightning CSS integration for Vite, Rollup, esbuild, Webpack, Vue CLI, and more.
Installation
npm i -D unplugin-lightningcss
Vite
// vite.config.ts
import LightningCSS from 'unplugin-lightningcss/vite'
export default defineConfig({
plugins: [LightningCSS()],
})
Rollup
Since Rollup does not support CSS out of the box, you need to use a CSS plugin like rollup-plugin-css-only.
// rollup.config.js
import css from 'rollup-plugin-css-only'
import LightningCSS from 'unplugin-lightningcss/rollup'
export default {
plugins: [LightningCSS(), css()],
}
esbuild
// esbuild.config.js
import { build } from 'esbuild'
build({
plugins: [require('unplugin-lightningcss/esbuild')()],
})
Webpack
// webpack.config.js
module.exports = {
/* ... */
plugins: [require('unplugin-lightningcss/webpack')()],
}
Options
import { Features } from 'lightningcss'
export default {
plugins: [
LightningCSS({
options: {
include: Features.Nesting,
},
/**
* Whether to export the transformed CSS as a default string export.
* @default false
*/
asString: false,
}),
],
}
License
MIT License © 2023-PRESENT Kevin Deng