Programming/Html n CSS

TailwindCSS posrcss.config.js 관련 에러 + tailwindCSS 적용 안됨 (vite, react )

감귤밭호지차 2023. 11. 21. 16:35

node:internal/process/promises:288
            triggerUncaughtException(err, true /* fromPromise */);
            ^

[Failed to load PostCSS config: Failed to load PostCSS config (searchPath: /Users/emma/Desktop/temp/invitation): [Error] Loading PostCSS Plugin failed: Cannot find module 'tailwindcss'
Require stack:
- /Users/emma/Desktop/temp/invitation/postcss.config.js

(@/Users/emma/Desktop/temp/invitation/postcss.config.js)
Error: Loading PostCSS Plugin failed: Cannot find module 'tailwindcss'
Require stack:
- /Users/emma/Desktop/temp/invitation/postcss.config.js

(@/Users/emma/Desktop/temp/invitation/postcss.config.js)
    at load (file:///Users/emma/Desktop/temp/invitation/node_modules/vite/dist/node/chunks/dep-T98iZFpD.js:35827:11)
    at file:///Users/emma/Desktop/temp/invitation/node_modules/vite/dist/node/chunks/dep-T98iZFpD.js:35852:16
    at Array.map (<anonymous>)
    at plugins (file:///Users/emma/Desktop/temp/invitation/node_modules/vite/dist/node/chunks/dep-T98iZFpD.js:35851:8)
    at processResult (file:///Users/emma/Desktop/temp/invitation/node_modules/vite/dist/node/chunks/dep-T98iZFpD.js:35921:14)
    at file:///Users/emma/Desktop/temp/invitation/node_modules/vite/dist/node/chunks/dep-T98iZFpD.js:36050:14]

 

 

 

 

해결방법 1. 

postcss.config.js 삭제

 

해결 방법 2, 

tailwindcss.config.js 와 postcss.config.js의 파일 확장자를 cjs로 바꿈 

 

 

 

킹받게 이거 말고도 tailwindcss가 자꾸 React, Vite 에서 적용이 안됬었는데 package.json보니까 tailwindcss가 설치 되어 있지 않았음.. 킹받네.. 분명 설치했는데 어디로 사라졌는지.. 휴..

 

시도 1

index.css에서 tailwindcss 설정 root 에서 불러오는거 다르게 불러와보기 

 

기존 

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

 

시도

@import "tailwindcss/base";

@import "tailwindcss/components";

@import "tailwindcss/utilities";

 

 

결론 

별 반 차이 없음 

 

 

 

 

참고 : 링크 1

참고 : stackoverflow