{"id":19435,"library":"csso-loader","title":"csso-loader","description":"Webpack loader for CSS minification using CSSO. Current stable version is 0.3.1, with basic support for CSSO's restructure, comments, debug, and usage options. This loader allows inline query parameters or a top-level 'csso' config object. It works with webpack 1.x (loaders array) and has limited updates since last release; modern webpack versions may require a different loader syntax. It integrates after css-loader to minify CSS output.","status":"maintenance","version":"0.3.1","language":"javascript","source_language":"en","source_url":"git://github.com/sandark7/csso-loader","tags":["javascript","webpack","loader","csso","css","minify"],"install":[{"cmd":"npm install csso-loader","lang":"bash","label":"npm"},{"cmd":"yarn add csso-loader","lang":"bash","label":"yarn"},{"cmd":"pnpm add csso-loader","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency for CSSO minification","package":"csso","optional":false},{"reason":"runtime peer dependency for loader context","package":"webpack","optional":false}],"imports":[{"note":"The loader is used via webpack configuration, not imported directly in code. It must be chained after css-loader to minify CSS output.","wrong":"import { csso-loader } from 'csso-loader'","symbol":"default","correct":"module.exports = { module: { loaders: [ { test: /\\.css$/, loader: 'css-loader!csso-loader' } ] } }"},{"note":"Options are passed via the 'csso' object in webpack config, not by importing the loader directly. Use LoaderOptionsPlugin for webpack 2+.","wrong":"import csso from 'csso-loader'","symbol":"csso","correct":"new webpack.LoaderOptionsPlugin({ options: { csso: { restructure: false } } })"},{"note":"Query parameters use a minus sign to disable default options (e.g., -restructure). Boolean false requires the '?' prefix for disabled features.","wrong":"loader: 'csso-loader?restructure=false'","symbol":"query parameters","correct":"loader: 'css-loader!csso-loader?-restructure&comments=false'"}],"quickstart":{"code":"// webpack.config.js\nmodule.exports = {\n  entry: './index.js',\n  output: { filename: 'bundle.js' },\n  module: {\n    loaders: [\n      {\n        test: /\\.css$/,\n        loader: 'css-loader!csso-loader',\n      }\n    ]\n  }\n};","lang":"javascript","description":"Minimal webpack config using csso-loader after css-loader to minify CSS files."},"warnings":[{"fix":"For webpack 2+, replace 'loaders' with 'rules' and use 'loaderOptionsPlugin' to pass options or switch to style-loader / css-loader built-in minification.","message":"This package uses webpack 1.x loader syntax. webpack 2+ uses rules.use or LoaderOptionsPlugin.","severity":"deprecated","affected_versions":">=0.1.0"},{"fix":"Either use query parameters in the loader string, or add 'csso' as a top-level key in webpack config.","message":"Options in webpack config must be placed in top-level 'csso' object, not inside loader options.","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Always use 'css-loader!csso-loader' in loader string so csso-loader receives already-parsed CSS.","message":"Loader chain order: css-loader must come before csso-loader (rightmost in loader string).","severity":"gotcha","affected_versions":">=0.1.0"},{"fix":"Pin csso version to 3.x or migrate to a modern minifier like css-minimizer-webpack-plugin.","message":"CSSo 4.0+ dropped some options, but csso-loader pins to older csso version.","severity":"breaking","affected_versions":">=0.3.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Disable CSS modules for the rule targeted by csso-loader, or use a different minifier.","cause":"csso-loader receives non-CSS content, e.g., from css-loader output with modules enabled.","error":"Module build failed: Error: No handler for content type 'text/css'"},{"fix":"Wrap csso options in new webpack.LoaderOptionsPlugin({ options: { csso: { restructure: false } } }) and apply to the correct loaders.","cause":"Using webpack 2+ and placing options in 'csso' object without LoaderOptionsPlugin.","error":"Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema."},{"fix":"Install csso as a devDependency: npm install csso --save-dev","cause":"csso not installed or not in node_modules.","error":"Error: Cannot find module 'csso'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}