Million snippets: NextJS Tailwind configuration

Published on
1 mins read

Welcome to Million snippets, a brand new series where I document repetitive tasks as a short note in Notion and publish them publicly so everyone (may) can enjoy. In this garden post, this is how to setup Tailwind from empty create-next-app

Part 1: Run multiple commands

pnpm install -D tailwindcss postcss autoprefixer
pnpm tailwindcss init -p

Part 2: Adding multiple files

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./src/**/*.{js,ts,jsx,tsx,mdx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}
@tailwind base;
@tailwind components;
@tailwind utilities;