SpringBoot-整合webjars靜態資源統一管理
阿新 • • 發佈：2018-12-18
一、前言
這個東西呢，我第一次接觸的時候就覺得很好玩，他能進行js、css檔案庫進行maven依賴管理，能像一般的jar包一樣進行管理，對於js、css版本的更新一類的會比較好
二、實踐
1. 我們首先要確定要什麼js或css庫，確定後進入webjars官網找到相應的依賴語句。請點選WebJars官網
2. 我們在官網找到自己想要的js、css庫
3.複製到專案pom檔案中
<!--我們匯入資原始檔需要寫版本號，用了這個之後就不用寫版本號了-->
<dependency>
< 4. 我們再寫一個頁面測試一下，引入資原始檔的路徑
路徑為：webjars/xxxxx/
我們可以在依賴庫裡找到我們依賴的jar包庫，庫中有我們需要的js、css庫，按照這個依次引入即可
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>webjars</title>
<!--匯入jq-->
<script type="application/javascript" src="webjars/jquery/jquery.js"></script>
<!--匯入bootstrap-->
<link rel="stylesheet" type="text/css" href="webjars/bootstrap/css/bootstrap.css">
<script type="application/javascript" src="webjars/bootstrap/js/bootstrap.js"></script>
</head>
<body>
<div class="bs-example" data-example-id="simple-jumbotron">
<div class="jumbotron">
<h1>Hello, world!</h1>
<p>我們已經成功匯入了BootStrapUI框架</p>
<p><a id="btn" class="btn btn-primary btn-lg" href="#" role="button">點選測試JQ框架是否匯入</a></p>
</div>
</div>
</body>
<script type="application/javascript">
$(function () {// 初始化內容
$("#btn").click(function(){
alert("jq框架載入成功！");
});
});
</script>
</html>
5. 訪問下我們的服務
三、優缺點總結
1. 優點
1. 靜態資源版本化管理
傳統的靜態資源需要自行維護，資源種類繁多，使得專案後期越來越臃腫，維護版本升級也變得困難，而使用WebJars方式進行管理後，版本升級問題迎刃而解
2. 提升編譯速度
經測試，使用WebJars的方式管理依賴可以給專案的編譯速度帶來2-5倍的速度提升，還在猶豫的小夥伴快點嘗試起來吧！
2. 缺點
1. pom檔案會變得更大更臃腫
2. 無法引入cdn加速，增大伺服器壓力
感謝您耐心閱讀黃大胖子的陋文，由於我還是一個未經世事的美男子，才疏學淺，如有錯誤之處，請多多指正！
江湖再見，歡迎您關注我！
本文專案原始碼 ：
GarfieldHuang/GarfieldHuang
