# 예시
# npm 7+, '--'를 반드시 붙여주세요
npm create vite@latest [폴더(프로젝트)명] -- --template [템플릿명]
# 현재 폴더에서 생성할 때
npm create vite@latest . -- --template react-ts
# 현재 폴더의 하위 폴더명으로 생성할 때
npm create vite@latest my-react-project -- --template react-ts
완료 후, npm install을 실행해주세요!
# msw 설치 - storybook과의 의존성으로 다운그레이드
npm install -D msw@latest
# MSW CLI Init
npx msw init ./public
npm install -D vitest
Install Tailwind CSS with Vite - Tailwind CSS
생성한 프로젝트의 위치에서 터미널을 연다. 프로젝트를 아직 생성하지 않았다면 위 작업 먼저할것.
Tailwind CSS 다운로드
# -D : 개발 의존성으로 설치. 개발과정에서만 사용하도록
# postcss : CSS를 브라우저에서 작동하도록 변환하는 도구
# autoprefixer : CSS에 자동으로 vendor prefix를 추가한다.
# vendor prefix: safari, chrome 등 여러 종류의 브라우저에서 사용가능하도록 붙이는 CSS 접두사
# ex) -webkit-user-select : chrome과 safari에서만 user-select라는 css를 사용하도록
npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p