jestPreviewConfigure()

// src/setupTests.js
import { jestPreviewConfigure } from 'jest-preview';
// Configure external CSS
import './global.css';
import './global.scss';
import '@your-design-system/css/dist/index.min.css';
import 'bootstrap/dist/css/bootstrap.min.css';

jestPreviewConfigure({
  // Configure public folder if your public folder is not "public"
  publicFolder: 'your-public-folder-name',
});

externalCss: string[] (Deprecated)

This option is deprecated. Please do not use it. Instead, import the CSS directly. See the instruction at Deprecate CSS

sassLoadPaths: string[]

Default: []

Paths in which to look for stylesheets loaded by rules like @use and @import in sass files should be configured via sassLoadPaths option. They should be path from root of your project. For example:

jestPreviewConfigure({
  // Configure Sass load paths
  sassLoadPaths: ['demo/assets/_scss/loadPathsExample'],
});

publicFolder: string

Default: undefined.

Name of your public folder from the project root.

You don't have to configure this by yourself if your public folder is public. Below you can find a list of public directories which have different names than public:

Project name	Public directory
GatsbyJS	static
Angular	src
Preact	src/static

autoPreview: boolean

Default: false

Automatically preview the UI in the external browser when the test fails. You don't need to invoke preview.debug() by yourself anymore.

Set to false if you experience any error or just want to opt out.