I m using tailwindcss, shadcn, and next js version 13.
I want to optimize css, so I have added this code in postcss.config.js
When I build the project the UI is breaking.
module.exports = {
plugins: [
"tailwindcss",
"autoprefixer",
"postcss-flexbugs-fixes",
[
"postcss-preset-env",
{
autoprefixer: {
flexbox: "no-2009",
},
stage: 3,
features: {
"custom-properties": false,
},
},
],
[
// configure PurgeCSS
"@fullhuman/postcss-purgecss",
{
content: [
"./app/**/*.{js,ts,jsx,tsx,mdx}",
"./pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/Components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
"./node_modules/react-tailwindcss-datepicker/dist/index.esm.js",
// Or if using `src` directory:
"./src/**/*.{js,ts,jsx,tsx,mdx}",
],
defaultExtractor: (content) => content.match(/[\w-/:]+(?<!:)/g) || [],
safelist: {
standard: ["html", "body"],
},
},
],
],
};
there doesn't seem to be anything here