KSS Webpack Plugin (v1.6.0) generates a KSS styleguide from CSS/SCSS sources during Webpack builds. It integrates kss-node into the Webpack pipeline, allowing styleguide generation as part of the build process. The plugin supports custom templates and automatic insertion of named chunks (JS or CSS) into the styleguide. Compatible with KSS (Knyle Style Sheets) documentation format. Last updated in 2021 with a low release cadence; peer dependencies require Webpack 3 or 4. Alternative to standalone kss-node CLI with tighter Webpack integration.
npm install kss-webpack-pluginVerified import paths — ran on the pinned version, not inferred.
Configures KssWebpackPlugin with source, destination, custom template, and automatic chunk insertion.
Define entry points with keys (e.g., entry: { main: './src/index.js' }) to use chunks configuration.Add a 'chunks' array in kssConfig listing the chunk names to inject.
Use webpack-kss or update plugin; or use kss-node CLI separately for Webpack 5 builds.
Evaluate alternative solutions like stylemark or standalone kss-node.
Upgrade Node.js to 12 or newer.
npm install kss@3 --save-dev
npm install kss --save-dev
Ensure the 'source' path exists and contains .css or .scss files.
Use webpack-kss for Webpack 5 or downgrade to Webpack 4.