개요
지난 글에서 사이드 프로젝트 진행으로 React Native를 사용하기로 했으나 다시 논의해본 결과 React로 결정되었다. 프론트는 야매로 GPT와 함께 해 본 경험이 전부이기에 이번 기회에 공부해보고자 "코드로 배우는 리액트:회사에서 개발할 때 쓰는 리액트와 스프링 부트" 책을 보고 따라하는 중이었다. 그러던 중 발생한 문제를 기록해놓고자 해당 게시글을 작성한다.
✅ 핵심 요점
react-scripts가 내부적으로 사용하는 tailwindcss는 CLI 실행 파일(npx tailwindcss)을 제공하지 않습니다.
그러니까 tailwindcss CLI를 직접 개발자가 설치해줘야 합니다.
문제상황
npm install -D tailwindcss 했을 때 아래와 같은 문제 발생
sh: tailwind: command not found
시도해본 방법
1. latest version으로 설치
npm install -D tailwindcss@latest
2. 전체 삭제 후 다시 깔기
rm -rf node_modlues package-lock.json
npm install
npm install -D tatilwindcss
3. latest version 삭제
npm uninstall tailwindcss
해결방법
npm install -D tailwindcss@3.4.17
npx tailwindcss init -p
🎯 결론
- react-scripts@5.x는 Webpack 4를 사용합니다.
- tailwindcss@4.x는 Webpack 5+ 또는 Vite 등 최신 빌드 도구에 맞춰져 있습니다.
- 따라서 tailwindcss@latest를 설치해도 실행이 제대로 되지 않거나, CLI 경로가 꼬일 수 있습니다.
'⚛️ React' 카테고리의 다른 글
[React Native] RN 개발환경 세팅 feat. Mac (0) | 2025.05.13 |
---|