[Project - IntelliJ] 서버 재기동없이 HTML, CSS, JS 등 정적 자원 반영하기
회원가입할 간단한 화면을 개발하고 있는데 html, css, js 파일을 고칠 때마다 서버를 재기동해 주는 것이 불편했다.
Eclipse로 개발했을 때는 서버 재기동 없이 프런트단에 잘 반영되었어서 더 불편함을 느꼈다.
따라서 정적 자원들을 변경할 때마다 반영해 주는 방법을 알아보자.
MacBook, IntelliJ, Spring Boot, Gradle을 사용하는 중이다.
1. Dependency 추가
gradle에 아래 코드가 있는지 확인하고, 없으면 추가한다.
developmentOnly 'org.springframework.boot:spring-boot-devtools'
devtools는 Spring Boot에서 제공하는 개발 편의를 위한 모듈로 브라우저로 전송되는 내용들에 대한 코드가 변경되면 자동으로 애플리케이션을 재시작하여 브라우저에도 업데이트 해주는 역할을 한다.
2. application.yml 추가
application.yml에 devtools 내용을 추가한다.
spring:
...
devtools:
livereload:
enabled: true
restart:
enabled: true
thymeleaf:
cache: false- devtools
- livereload : 소스 코드가 변경될 때 자동으로 브라우저를 새로고침하여 변경 사항을 실시간으로 반영
- restart : 코드 변경 시 애플리케이션을 자동으로 다시 시작
- thymeleaf
- cache : 타임리프 템플릿 캐싱을 사용할지 여부 (개발 중에는 템플릿 변경이 자주 일어날 수 있으므로 캐시를 끄는 것이 편리)
3. IntelliJ 설정
IntelliJ IDEA > Settings... > Build, Execution, Deployment > Compiler에서
Build project automatically 체크박스를 활성화시킨다.
IntelliJ IDEA > Settings... > Advanced Settings에서
Allow auto-make to start even if developed application is currently running 체크박스를 활성화시킨다.
4. Run/Debug Configurations 설정
Run > Edit Configurations... > Build and run에서
우측 Modify options를 클릭하면 Add Run Options 창이 뜬다.
Add Run Options 창에서 On 'Updata' actions와 On frame deactivation을 클릭하여 옵션을 추가한다.
옵션을 추가하면 아래와 같이 나타날 것이다.
확인 후 적용한다.
5. 서버 재기동
설정을 모두 마친 후 서버를 재기동한다.
이제 html, css, js 파일들을 수정하면 바로 화면에서 변경되는 것을 확인할 수 있다!!
도움 받은 곳
https://hajoung56.tistory.com/71