快捷導(dǎo)航

SpringBoot整合BootStrap實(shí)戰(zhàn)

更新時(shí)間：2021年09月02日 10:52:22 作者：java菜魚

這篇文章主要介紹了SpringBoot整合BootStrap實(shí)戰(zhàn)，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教

SpringBoot整合BootStarp

一開始在將BootStrap整合到項(xiàng)目中時(shí)，以為SpringBoot項(xiàng)目和以前的javaWeb一樣，直接在頁面中引用css,js即可，但是打開界面時(shí)，樣式效果出不來，后來看了幾篇文章以及自己摸索，現(xiàn)將代碼展示如下：

1.Pom文件

<properties>
        <webjars-locator>0.32-1</webjars-locator>
        <bootstrap>3.3.7</bootstrap>
        <jquery>3.3.1</jquery>
</properties>

這是需要導(dǎo)入的依賴

<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>webjars-locator</artifactId>
    <version>${webjars-locator}</version>
</dependency>
 
<!-- bootstrap -->
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>bootstrap</artifactId>
    <version>${bootstrap}</version>
</dependency>
 
<!-- jquery -->
<dependency>
    <groupId>org.webjars</groupId>
    <artifactId>jquery</artifactId>
    <version>${jquery}</version>
</dependency>

2.在resource下創(chuàng)建一個(gè)l文件路徑：statis/webjars

3.將頁面放在src/main/webapp/WEB-INF/views下

這是我自己新建的,如上所示

4.界面添加以下幾行

<script src="/webjars/jquery/jquery.min.js"></script>
<script src="/webjars/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/webjars/bootstrap/css/bootstrap.min.css" rel="external nofollow" />

5.application.yml配置文件中

spring:  
    mvc:
      view:
        prefix: /WEB-INF/views/ #前綴
         suffix: .jsp   #后綴

6. Controller

@Controller
@RequestMapping(value = "/show")
public class PageController {
	
    @RequestMapping("/getHelloJsp")
    public String helloJsp(ModelMap map) {
        // 加入一個(gè)屬性，用來在模板中讀取
        // map.addAttribute("name", "wade");
        return "hello";
    }	
}

此時(shí)啟動(dòng)項(xiàng)目的啟動(dòng)類，輸入url:localhost:端口號/show/getHelloJsp 即可正確的顯示頁面的樣式

注意

因?yàn)槲绎@示的是jsp

所以你還得提前在pom中添加關(guān)于jsp的兩個(gè)依賴

<dependency>
   <groupId>org.apache.tomcat.embed</groupId>
   <artifactId>tomcat-embed-jasper</artifactId>
   <scope>provided</scope>
</dependency>
        
<dependency>  
     <groupId>javax.servlet.jsp.jstl</groupId>  
     <artifactId>jstl-api</artifactId>  
     <version>1.2</version>  
</dependency>

因?yàn)槭浅鯇W(xué)springBoot所以文件路徑各方面可能沒有按照springBoot的規(guī)范來，以后慢慢糾正，如有更好的方式，請不吝賜教。

希望能給大家一個(gè)參考吧，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

spring cloud gateway請求跨域問題解決方案
這篇文章主要介紹了spring cloud gateway請求跨域問題解決方案,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-01-01
JavaSE中比較器、深拷貝淺拷貝舉例詳解
在Java中一切都可以視為對象,在Java中我們經(jīng)常使用引用去操作對象,下面這篇文章主要給大家介紹了關(guān)于JavaSE中比較器、深拷貝淺拷貝的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下
2024-07-07
Java基礎(chǔ)知識精通各種運(yùn)算符
計(jì)算機(jī)的最基本用途之一就是執(zhí)行數(shù)學(xué)運(yùn)算，作為一門計(jì)算機(jī)語言，Java也提供了一套豐富的運(yùn)算符來操縱變量，本篇對大家的學(xué)習(xí)或工作具有一定的價(jià)值，需要的朋友可以參考下
2022-04-04
Java生成一定規(guī)則遞增編號的示例代碼
項(xiàng)目需求中有時(shí)需要生成一定規(guī)則遞增編號,本文主要介紹了Java生成一定規(guī)則遞增編的示例代碼,具有一定的參考價(jià)值,感興趣的可以了解一下
2023-08-08
Java使用Freemarker頁面靜態(tài)化生成的實(shí)現(xiàn)
這篇文章主要介紹了Java使用Freemarker頁面靜態(tài)化生成的實(shí)現(xiàn)，頁面靜態(tài)化是將原來的動(dòng)態(tài)網(wǎng)頁改為通過靜態(tài)化技術(shù)生成的靜態(tài)網(wǎng)頁,FreeMarker?是一個(gè)用?Java?語言編寫的模板引擎，它基于模板來生成文本輸，更多相關(guān)內(nèi)容需要的小伙伴可以參考一下
2022-06-06
Java8新特性之類型注解_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了Java8新特性之類型注解的相關(guān)資料,需要的朋友可以參考下
2017-06-06
SpringEvents與異步事件驅(qū)動(dòng)案例詳解
本文深入探討了SpringBoot中的事件驅(qū)動(dòng)架構(gòu),特別是通過Spring事件機(jī)制實(shí)現(xiàn)組件解耦和系統(tǒng)擴(kuò)展性增強(qiáng),介紹了事件的發(fā)布者、事件本身、事件監(jiān)聽器和事件處理器的概念,感興趣的朋友跟隨小編一起看看吧
2024-09-09
mybatis如何實(shí)現(xiàn)saveOrUpdate
這篇文章主要介紹了mybatis如何實(shí)現(xiàn)saveOrUpdate問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-02-02
MyEclipse安裝JS代碼提示的教程（Spket插件）
本篇文章主要介紹了MyEclipse安裝JS代碼提示的教程（Spket插件），小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-12-12
Java實(shí)現(xiàn)定時(shí)讀取json文件里內(nèi)容的示例代碼
有時(shí)候我們會需要定時(shí)來讀取JSON配置文件里的內(nèi)容,來執(zhí)行一些業(yè)務(wù)邏輯上的操作,本文就介紹了Java實(shí)現(xiàn)定時(shí)讀取json文件里內(nèi)容的示例代碼,感興趣的可以了解一下
2023-08-08