css

• Type: boolean | { include?, exclude?, modules? }

Configure if CSS should be processed. When excluded, CSS files will be replaced with empty strings to bypass the subsequent processing. CSS Modules will return a proxy to not affect runtime.

WARNING

This option is not applied to browser tests.

css.include

• Type: RegExp | RegExp[]
• Default: []

RegExp pattern for files that should return actual CSS and will be processed by Vite pipeline.

TIP

To process all CSS files, use /.+/.

css.exclude

• Type: RegExp | RegExp[]
• Default: []

RegExp pattern for files that will return an empty CSS file.

css.modules

• Type: { classNameStrategy? }
• Default: {}

css.modules.classNameStrategy

• Type: 'stable' | 'scoped' | 'non-scoped'
• Default: 'stable'

If you decide to process CSS files, you can configure if class names inside CSS modules should be scoped. You can choose one of the options:

• stable: class names will be generated as _${name}_${hashedFilename}, which means that generated class will stay the same, if CSS content is changed, but will change, if the name of the file is modified, or file is moved to another folder. This setting is useful, if you use snapshot feature.
• scoped: class names will be generated as usual, respecting css.modules.generateScopedName method, if you have one and CSS processing is enabled. By default, filename will be generated as _${name}_${hash}, where hash includes filename and content of the file.
• non-scoped: class names will not be hashed.

WARNING

By default, Vitest exports a proxy, bypassing CSS Modules processing. If you rely on CSS properties on your classes, you have to enable CSS processing using include option.