[SpringBoot] front-end(html, css, js 등) 파일 변경 후 브라우저에서 적용이 안될 때

해당 프로젝트에서 진행하는 환경은 다음과 같습니다. 

- Spring Boot - 2.0.3.RELEASE 

- Gradle 

- Thymeleaf

Front-end 작업을 하기위해 html, css, js 파일을 수정한 후에 브라우저 새로고침해도 적용이 안되는 경우가 있습니다. 찾아보면 Thymeleaf 같은 템플릿 엔진을 사용할 경우엔 리소스 갱신을 위해 서버를 재시작 해야한다고 합니다.

Spring 으로 개발할 경우 webapp 디렉토리에서 관리하기 때문에 즉각 화면갱신이 가능했지만 SpringBoot에서는 resouces 디렉토리에서 관리가 되기 때문에 톰캣등 사용하는 WAS를 재시작 해야합니다.

그래서 이런 문제점을 해결하고자 찾아보니 Devtools라는 것을 활용하는 방법이 있었습니다.

Devtools를 설정 및 적용방법.

1. 설정방법

gradle 에 의존성 추가합니다.

dependencies {

...

  compile('org.springframework.boot:spring-boot-devtools')

}

2. application 설정파일 수정(.yml 또는 .properties) 

여기서는 application.yml 파일을 수정했습니다

thymeleaf 템플릿 엔진 캐시를 비활성화를 추가했습니다.

spring:

  devtools:

    livereload:

      enabled: true

  thymeleaf:

    cache: false

여기까지 하면 설정은 끝입니다. 

서버를 재시작하고 그래도 안되면 브라우저의 캐시가 남아있는지 의심하는 것이 좋습니다.

브라우저를 새로고침 할때 크롬기준(ctrl + F5)로 시도하시길 추천드립니다.

: 해당 사이트와 관련한 Cache 메모리 등을 모두 강제로 삭제합니다.