{"id":22217,"library":"rollup-plugin-scss","title":"rollup-plugin-scss","description":"A Rollup plugin for compiling .scss, .sass, and .css files into a single CSS file, with support for source maps, custom processors (e.g., PostCSS), and prefix injection. Version 4.0.1 is stable and actively maintained. It automatically uses the 'sass' package over 'node-sass', is written in TypeScript, and integrates seamlessly with Rollup's asset pipeline. Compared to alternatives like rollup-plugin-postcss, it focuses solely on Sass/SCSS compilation without additional CSS processing by default, offering a leaner setup for pure SCSS projects.","status":"active","version":"4.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/thgh/rollup-plugin-scss","tags":["javascript","rollup-plugin","css","sass","scss"],"install":[{"cmd":"npm install rollup-plugin-scss","lang":"bash","label":"npm"},{"cmd":"yarn add rollup-plugin-scss","lang":"bash","label":"yarn"},{"cmd":"pnpm add rollup-plugin-scss","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Required peer dependency: the compiler used to transpile SCSS/SASS. Either this or node-sass must be installed.","package":"sass","optional":true},{"reason":"Optional alternative compiler if 'sass' is not installed. Automatically detected if present.","package":"node-sass","optional":true}],"imports":[{"note":"ESM-only since v3. CommonJS require will fail.","wrong":"const scss = require('rollup-plugin-scss')","symbol":"default","correct":"import scss from 'rollup-plugin-scss'"},{"note":"The plugin is exported as default, not a named export. Named import will yield undefined.","wrong":"import { scss } from 'rollup-plugin-scss'","symbol":"scss","correct":"import scss from 'rollup-plugin-scss'"},{"note":"TypeScript users can import the options type for type-safe configuration. Available in v3+.","wrong":"","symbol":"SassPluginOptions (TypeScript)","correct":"import type { SassPluginOptions } from 'rollup-plugin-scss'"}],"quickstart":{"code":"// rollup.config.js\nimport scss from 'rollup-plugin-scss';\n\nexport default {\n  input: 'src/index.js',\n  output: {\n    file: 'dist/bundle.js',\n    format: 'esm',\n    assetFileNames: '[name][extname]'\n  },\n  plugins: [\n    scss({\n      fileName: 'bundle.css',\n      sourceMap: true,\n      output: (styles, styleNodes) => {\n        console.log(`Generated ${styles.length} bytes of CSS`);\n      },\n      include: ['**/*.scss'],\n      exclude: ['**/vendor/**'],\n      failOnError: true,\n      verbose: false\n    })\n  ]\n};","lang":"javascript","description":"Example Rollup config using rollup-plugin-scss with options: custom output filename, source maps, include/exclude patterns, error handling, and output callback."},"warnings":[{"fix":"Add 'sass' (or 'node-sass') to your devDependencies: npm install --save-dev sass","message":"v3 removed node-sass from optionalDependencies; you must install sass or node-sass explicitly.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Use dynamic import if needed: const scss = (await import('rollup-plugin-scss')).default;","message":"v3 switched to ESM-only; CommonJS require no longer works.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Update callback: function(styles, styleNodes) where styleNodes is Array<{filename: string, content: string}>","message":"The 'output' callback signature changed in v3: second parameter is an array of style objects instead of a single string.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Use 'fileName' instead of 'name' to set the output CSS filename.","message":"The 'name' option is deprecated in favor of 'fileName' since v3.","severity":"deprecated","affected_versions":">=3.0.0"},{"fix":"Explicitly set the 'sass' option to the compiler you want: sass: require('node-sass')","message":"If both 'sass' and 'node-sass' are installed, 'sass' is preferred; this may cause unexpected behavior if your project depends on node-sass specifics.","severity":"gotcha","affected_versions":">=3.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Install: npm install --save-dev rollup-plugin-scss. For CJS, use dynamic import: const scss = (await import('rollup-plugin-scss')).default;","cause":"Package not installed or ESM-only package loaded with require in Node < 12.","error":"Error: Cannot find module 'rollup-plugin-scss'"},{"fix":"Use default import: import scss from 'rollup-plugin-scss'","cause":"Named import { scss } used instead of default import.","error":"TypeError: scss is not a function"},{"fix":"Set 'output' to a callback function or false: output: (styles, styleNodes) => { ... }","cause":"Passing an object to the 'output' option; it expects a function or boolean false.","error":"Error: Options.output must be of type function or false, got object"},{"fix":"Install sass or node-sass: npm install --save-dev sass","cause":"Missing Sass compiler dependency.","error":"Error: Cannot find module 'sass'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}