Code Snippets by Leerlandais

Files for tailwind postcss

Run the install command, create the 3 files as named, update package.json and run the build command

// First, run this :
npm install tailwindcss postcss autoprefixer @fullhuman/postcss-purgecss

// root/tailwind.config.js
/** @type {import('tailwindcss').Config} */
module.exports = {
    content: ['./view/**/*.twig', './public/scripts/*.js'],
    theme: {
        extend: {},
    },
    plugins: [],
}

// root/postcss.config.js
module.exports = {
    plugins: {
        tailwindcss: {},
        autoprefixer: {},
    }
};

// root/public/styles/tailwind.css
@tailwind base;
@tailwind components;
@tailwind utilities;
/* Personalised TW Classes go here */

// adjust the package.json to : 
{
  "dependencies": {
    "@fullhuman/postcss-purgecss": "^7.0.2",
    "autoprefixer": "^10.4.20",
    "postcss": "^8.4.49",
    "tailwindcss": "^3.4.17"
  },
  "scripts": {
    "build:css": "npx tailwindcss -i ./public/styles/tailwind.css -o ./dist/tailwind.min.css --minify"
  }
}

// Finally, run this : 
npm run build:css