개인 tailwindcss 세팅용 문서

1. 필요한 패키지 설치

 

yarn add tailwindcss postcss autoprefixer

 

3형제 설치 후 

 

2. config 파일 손봐주기

 

npx tailwindcss init -p

 

하면 postcss.config , tailwind.config 두개 파일이 생성되는데 post는 냅두고 tail config 에서

 

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

 

 

3. globals.css 파일에 3형제 임포트

 

@tailwind base;
@tailwind components;
@tailwind utilities;

 

4. _app.js 에 임포트

 

import '본인/경로/맞게/globals.css';

 

끄트