Plumeria logoPlumeria

PostCSS

@plumeria/postcss-plugin is the PostCSS plugin for Plumeria.
A swc-compiler based postcss-plugin with static extraction in the style of Plumeria.

Installation

Terminal
npm i --save-dev @plumeria/postcss-plugin
Terminal
yarn add -D @plumeria/postcss-plugin
Terminal
pnpm i --save-dev @plumeria/postcss-plugin

Configuration

Reduce build times by narrowing the scope using include and exclude.

postcss.config.js
module.exports = {
  plugins: {
    '@plumeria/postcss-plugin': {
      include: ['**/*.{ts,tsx}'],
      exclude: ['**/node_modules/**', '**/.next/**'],
    },
  },
};

CSS extraction marker

Include css file @plumeria marker.
Atomic css is aggregated at build time into marked css files.

css
/* import in app entry point */
@plumeria;
...

It works with Next.js Turbopack and Webpack.

On this page