Next
Learn more about @plumeria/next-plugin.
It is the plumeria @plumeria/next-plugin package
AST parse compiles plumeria styles into CSS (HMR) use:
@plumeria/turbopack-loader and @plumeria/webpack-plugin
Installation
npm i --save-dev @plumeria/next-plugin @plumeria/postcss-pluginyarn add -D @plumeria/next-plugin @plumeria/postcss-pluginpnpm i --save-dev @plumeria/next-plugin @plumeria/postcss-pluginnext.config.ts
If you do not add turbopack to the end of the path, it will be webpack.
import type { NextConfig } from "next";
import { withPlumeria } from "@plumeria/next-plugin/turbopack";
const nextConfig: NextConfig = {
/* config options here */
};
export default withPlumeria(nextConfig);postcss.config.js
Reduce build times by narrowing the scope using include and exclude.
module.exports = {
plugins: {
'@plumeria/postcss-plugin': {
include: [
'./app/**/*.{ts,tsx}',
'./components/**/*.{ts,tsx}',
'./lib/**/*.{ts,tsx}'
],
exclude: ['**/node_modules/**', '**/.next/**'],
},
},
};CSS extraction marke
Inclulde css file @plumeria marke.
Atomic css is aggregated at build time into marked css files.
/* app/global.css */
/* import in app/layout.tsx */
@plumeria;
...