SpringBoot整合BootStarp
一开始在将BootStrap整合到项目中时，以为SpringBoot项目和以前的javaWeb一样，直接在页面中引用css,js即可，但是打开界面时，样式效果出不来，后来看了几篇文章以及自己摸索，现将代码展示如下：
1.Pom文件
|
1 2 3 4 5 |
< properties > < webjars-locator >0.32-1</ webjars-locator > < bootstrap >3.3.7</ bootstrap > < jquery >3.3.1</ jquery > </ properties > |
这是需要导入的依赖
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
< 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下创建一个l文件路径：statis/webjars
3.将页面放在src/main/webapp/WEB-INF/views下
这是我自己新建的,如上所示
4.界面添加以下几行
|
1 2 3 |
<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配置文件中
|
1 2 3 4 5 |
spring: mvc: view: prefix: /WEB-INF/views/ #前缀 suffix: .jsp #后缀 |
6. Controller
|
1 2 3 4 5 6 7 8 9 10 11 |
@Controller @RequestMapping (value = "/show" ) public class PageController {
@RequestMapping ( "/getHelloJsp" ) public String helloJsp(ModelMap map) { // 加入一个属性，用来在模板中读取 // map.addAttribute("name", "wade"); return "hello" ; } } |
此时启动项目的启动类，输入url:localhost:端口号/show/getHelloJsp 即可正确的显示页面的样式
注意
因为我显示的是jsp
所以你还得提前在pom中添加关于jsp的两个依赖
|
1 2 3 4 5 6 7 8 9 10 11 |
< 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 > |
因为是初学springBoot所以文件路径各方面可能没有按照springBoot的规范来，以后慢慢纠正，如有更好的方式，请不吝赐教。
希望能给大家一个参考吧，也希望大家多多支持。
原文链接：https://blog.csdn.net/u011972171/article/details/79806053
查看更多关于SpringBoot整合BootStrap实战的详细内容...