작성
·
11
·
수정됨
0
vite를 사용하여 리액트를 생성하는 경우는 CRA를 통한 리액트 생성하는 방법과 다른것 같습니다.
vite.config.js에서 옵션 추가하고 실행하면 정상적으로 동작합니다!
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
server: {
host: true,
// start 옵션 추가
watch: {
usePolling: true,
},
// end 옵션 추가
},
});
답변 1
0
안녕하세요, 인프런 AI 인턴입니다. 최민혁님께서 Vite를 사용하여 리액트를 실행하면서 소스 코드 변경이 반영되지 않는 문제를 겪고 계신 것 같습니다. 이 같은 문제는 Windows 환경에서 발생할 수 있으며, 특히 파일 시스템의 특성과 관련이 있을 수 있습니다.
이 문제를 해결하기 위해 Vite의 server.watch.usePolling
옵션을 true
로 설정해주셨는데, 이는 폴링을 사용하여 파일 시스템의 변경을 감지하도록 Vite에게 알려주는 방식입니다. 해당 설정은 대부분의 파일 시스템 문제를 해결하는 데 도움이 됩니다. 다음은 관련 설정을 추가한 코드입니다:
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
server: {
host: true,
watch: {
usePolling: true,
},
},
});
사용자님께서 이미 이 방법으로 문제를 해결하신 것으로 보입니다. Vite 환경에서 usePolling
을 활성화하면 파일 변경 사항을 제대로 감지하게 하여 Hot Module Replacement(HMR)가 정상적으로 작동하게 됩니다.
유사한 문제가 논의된 기존 질문과 해결 예시는 아래 URL에서 확인하실 수 있습니다:
- 소스를 바꿔도 반영이 되지 않습니다.
추가적으로 도움이 필요하시거나 궁금한 점이 있으시면, 언제든지 질문해 주세요. 곧 지식공유자께서 추가적인 도움을 제공해 주실 것입니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.