SCSS

Enable SCSS stylesheet generation

Configuring SCSS stylesheet generation with Agrippa is done by setting the options.styling field in agrippa.config.mjs to Styling.SCSS, like so:

// @ts-check
// note the new import
import { defineConfig, Styling } from "agrippa";

export default defineConfig({
  options: {
    styling: Styling.SCSS

    // ...
  },
  // ...
});

Styling.SCSS is equivalent to "scss", but using the built-in Styling enum is clearer and less prone to errors.

Toggle SCSS Modules on or off

By default, Agrippa generates SCSS stylesheets as SCSS Modules, as indicated by the .module.scss suffix of the generated filename.

If you want or need to turn modules off, set options.styleFileOptions.module to false in agrippa.config.mjs, like so:

// @ts-check
import { defineConfig, Styling } from "agrippa";

export default defineConfig({
  options: {
    styling: Styling.SCSS

    styleFileOptions: {
      module: false
    }

    // ...
  },
  // ...
});