-
[Vite] ESlint 와 Prettier, Package.json 초기설정프로그래밍/React 2023. 10. 2. 22:27
위 블로그를 참고해서 초기설정을 해보자~
절대경로 설정 간에 트러블 슈팅
1. eslint의 설치 과정에서 에러
test용 project에서 절대경로 설정이 성공하였다.
차이점: eslint 설정 간에 차이가 있다.
성공작 : eslint를 설정하는 과정에서 npx eslint --init을 사용해서 eslint를 설정하고 format 형태를 json으로 설정을 하였다.
실패작 : .eslintrc.cjs 형태로 되어있고 내부 코드도 다름.
2. package.json 에 script 설정의 차이
성공작 : script를 따로 설정을 해줌
"scripts": { "dev": "vite", "build": "tsc && vite build", "preview": "vite preview", "lint": "eslint ./src/**/*.{ts,tsx,js,jsx}", "lint:fix": "eslint --fix ./src/**/*.{ts,tsx,js,jsx}", "format": "prettier --write --cache ." // 이건 prettier 관련 },
실패작 : 안해줌 그냥 쓰여있는 그대로 사용함
3. tsconfig.json 설정만 해도 dev에서는 사용이 가능해야함
vite.config.ts에 설정을 하기 전에도 절대경로 설정을 하면 사용이 가능하다.
tsconfig.json을 설정을 완료를 하고 vite.config.json을 건드리자
4. '@vitejs/plugin-react' 모듈 또는 해당 형식 선언을 찾을 수 없습니다.
vite.config.ts에서 이러한 오류가 나타나게 되는데 간단하게 vscode를 재시작하니 사라졌다.
'프로그래밍 > React' 카테고리의 다른 글
[전역상태관리] Recoil (1) 2023.11.02 [React] react-router-dom의 사용 (1) 2023.10.04 [제로초 Slack 클론 코딩] 백엔드 준비 + 초기설정 (Day-1) (0) 2023.09.29 [은버지 Study] React-query에 대하여 (0) 2023.07.31 [React] useRef 의 개념 (0) 2023.07.25