This setup works out-of-the-box. It also includes a watcher which re-compiles the CSS whenever a CSS file changes.


Write modern CSS

You can write modern CSS with support for CSS imports and CSS variables without worrying about vendor prefixes.

PostCSS is pre-configured to compile all your CSS in the src/ directory using the following processors:

src/index.css is the main entry point for the CSS compile script. So be sure to start there.

Note: the aim of this recipe is to write spec compliant CSS. All processors are selected to enable this and improve browser support. Processors adding non-standard features are avoided.

Add & configure processors

You can configure the processors mentioned above or add your own processors in scripts/postcss.js.

Compile CSS

To compile your CSS for production (incl. minification), run:

npm run build:css

Or simply npm run build as this will also run build:css.

The compiled CSS plus its sourcemap is written to the dist/ directory.


To compile your CSS (excl. minification) whenever you make a change to a CSS file:

npm run watch:css

Or simply npm run watch as this will also run watch:css.

These scripts are configured in package.json.