spring boot, vue3 하나의 프로젝트에서 개발 시 화면 갱신 문제

Question

안녕하세요 spring boot 3.x , vue3 composition-api 를 하나의 프로젝트로 개발을 진행하고 있습니다.현재 문제는 frontend 단에서 html 코드를 수정하면 톰켓을 재시작해야지만 화면에 반영이 되는 상황입니다.springboot를 사용하지 않고 vue만 사용했을 경우 npm run dev 를 하면 파일을 수정하고 저장하면 바로 화면에 반영이 되는걸로 알고 있는데 spring boot를 연동시키다 보니 tomcat을 재시작하지 않으면 화면에 반영이 되지 않고 있습니다.현재 프로젝트 구조는srcfrontendmainjavaresourcesstatic이렇게 src 폴더 밑에 frontend (vue 프로젝트) 와 springboot 하나의 프로젝트로 관리하려고 합니다.vite.config.js 에는build: { outDir: '../main/resources/static', emptyOutDir: true},// 개발서버 설정server: { // 프록시 설정 proxy: { '/' : { target :'http://localhost:8020/', changeOrigin: true } }},현재 이렇게 해놓았고npm run build를 했을 떄 static 하위에 파일들이 잘 쌓이는것은 확인했습니다.현 상황에서 구글링을 했을 경우 이렇게만 했어도 연동이 잘 되는 것만 나오는데전 무엇이 문제인지를 모르겠습니다..

Clickin · Answer

개발환경에서는 프론트엔드를 dev server 쓰고 프록시로 로컬 백엔드 바라보게 하고(포트 다름)운영환경에서는 gradle npm 플러그인 등을 사용해서 jar 빌드할 때 같이 빌드되는 환경이 좋겠습니다.백엔드 개발 소스의 리소스 폴더에다가 개발환경을 직접 넣는 방식은 최적화되지 않은 빌드가 들어가니 별로 좋은 방식이 아닙니다.

icksss · Answer

Front 와 Back을 분리하는건 어떠신쥐.

カワウソ · Answer

Preview 와 Build 는 개발용을 위해 만들어진 명령어는 아니긴 합니다. 사실 프록시 구성을 해놓고 빌드 방식을 사용하려는 것이 더 의아합니다.

yeori · Answer

개발 환경과 배포 환경을 분리하는게 좋습니다.개발 중에는 백엔드와 프론트엔드를 나눠서 개발하고, 나중에 배포할때 프론트엔드 산출물을 static 폴더에 집어던져서 jar로 뽑아냅니다.

spring boot, vue3 하나의 프로젝트에서 개발 시 화면 갱신 문제

4개의 답변

기술 목록