CODEWITHSUNDEEP
javascripttailwind-csspurge
Raphael
Raphael

Reputation: 1812

Removing unused styles when using tailwind with react vite app

I am trying to remove the unused css during build process. npm run build => "build": "tsc && vite build --base=/root/",

I am getting error message like below cannot read property 'match' of undefined enter image description here

Tailwind config entry:

purge: [{ enabled: true, content: ['./src/**/*.tsx'] }],

Upvotes: 1

Views: 2223

Answers (2)

DPGraham4401
DPGraham4401

Reputation: 187

The purge option has been deprecated since tailwind version 3. Use the content field to configure the paths to any file (e.g, HTML, JavaScript, CSS, etc.) that contain Tailwind class names instead of the purge field.

// tailwind.config.js
export default {
  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}', './public/**/*.html'],
  plugins: [],
};

Upvotes: 0

JsWizard
JsWizard

Reputation: 1749

Try use this config,

// tailwind.config.js
module.exports = {
  mode: 'jit',
  purge: {
    enabled: process.env.NODE_ENV === 'production',
    safeList: [],
    content: ['./index.html', './src/**/*.tsx', './src/**/*.ts'],
  },

Upvotes: 2

Related Questions