Bootstrap WebJar 사용하기
1. Bootstrap, JQuery Webjar 찾기
IntelliJ를 업데이트 했더니 갑자기 SDK 세팅값이 사라져 버렸다. T.T
https://www.webjars.org/에서 Bootstrap, jquery webjar찾기 (gradle 용으로)
compile 'org.webjars:jquery:3.2.1'
compile 'org.webjars:bootstrap:4.0.0-beta.3'
2. Bootstrap starter template에서 소스 copy하기
https://getbootstrap.com/docs/4.0/getting-started/introduction/
popper.js는 Popular WebJars없으니 찾아보자
[Add a WebJar] 옆의 search에서 검색하기
1.3.0 version: compile 'org.webjars.npm:popper.js:1.13.0'
3. Thymeleaf로 src로 변경하기
1) thymeleaf 네임스페이스 지정하기
<!doctype html>
<html lang="en"> --> <html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
2) boot, jquery webjar로 변경하기
<link rel="stylesheet" th:href="@{/webjars/bootstrap/4.0.0-beta.3/css/bootstrap.min.css}">
<script th:src="@{/webjars/jquery/3.2.1/jquery.min.js}"></script>
<script th:src="@{/webjars/popper.js/1.13.0/dist/popper.min.js}"></script>
<script th:src="@{/webjars/bootstrap/4.0.0-beta.3/js/bootstrap.min.js}"></script>
4. Thymeleaf cache 설정하기
src/main/resources 디렉토리에 application.properties 파일을 만들고
spring.thymeleaf.cache=false 로 설정
5. 스프링 부트 시작해서 해당 html 접근하기
chrome > More Tools > Devloper Tools
* Console 메뉴와 Sources 메뉴에서 WebJar 소스 JS 파일 위치가 오류가 있는지 확인하기