개발일지

tailwindcss 적용하기

케이오스 2021. 11. 8. 05:09

공식 홈피 설명대로 하면 되긴하지만, 에러문구가 뜨는게 싫어서 옛날 방식을 정리해 둠.

$ npx create-react-app project_name --template typescript
$ cd project_name
$ npm i -D tailwindcss
$ npm i -D postcss autoprefixer // 3모듈을 한번에 설치하려고 하면 에러 뿜음
$ npx tailwindcss init
//--- package.json script 수정
"tailwind:build": "tailwind build -i ./src/styles/tailwind.css -o ./src/styles/styles.css",
"start": "npm run tailwind:build & react-scripts start",
  ...

css 파일 적용해서 실행해 보고, 안되면 vscode 재시작

// ./src/styles/tailwind.css
@tailwind base;
@tailwind components;
@tailwind utilities;