[Portfolio 포트폴리오] 리액트에서 tailwindcss 설치 react tailwindcss install with yarn

yarn으로 tailwindcss install

yarn add -D tailwindcss postcss autoprefixer

 

tailwind.config.js 파일 생성

yarn tailwind init -p

 

tailwind.config.js 파일에

module.exports = {
  content: [
  	"./src/**/*.{js,jsx,ts,tsx}",  
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

 

[src] 하위 파일 중 확장자가 ".js", ".jsx", ".ts", ".tsx" 인 파일을 대상으로 함

 

사용할 CSS 파일에 삽입

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

 

CSS 파일이 여러개여도

선언은 한번만 하면 전체 적용됨

 

vscode 확장프로그램 Tailwind CSS IntelliSense 설치