SpringBoot --thymeleaf(资源文件css、js的引入)

目录结构:

SpringBoot --thymeleaf(资源文件css、js的引入)_第1张图片

 

pom.xml:


xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
4.0.0


com.cxb
SpringBoot-Thymeleaf
0.0.1-SNAPSHOT
war


SpringBoot-Thymeleaf
Demo project for Spring Boot



org.springframework.boot
spring-boot-starter-parent
2.0.2.RELEASE





UTF-8
UTF-8
1.8





org.springframework.boot
spring-boot-starter-web


org.mybatis.spring.boot
mybatis-spring-boot-starter
1.3.2




org.springframework.boot
spring-boot-devtools
runtime


mysql
mysql-connector-java
runtime


org.springframework.boot
spring-boot-starter-tomcat
provided


org.springframework.boot
spring-boot-starter-test
test




    org.springframework.boot
    spring-boot-starter-thymeleaf






org.springframework.boot
spring-boot-maven-plugin



 

 

 

application.yml(添加 笑脸:) )

spring:
  thymeleaf:
    #缓冲的配置
    cache: false
    check-template: true
    check-template-location: true
    #开启MVC thymeleaf 视图解析
    enabled: true
    encoding: utf-8
    mode: HTML5
    prefix: classpath:/templates/
    suffix: .html
    
    
  #配置数据源
  datasource:
     url: jdbc:mysql://127.0.0.1:3306/shiro_test?useUnicode=true&characterEncoding=utf8
     username: root
     password: 123456
     driver-class-name: com.mysql.jdbc.Driver
  
  jpa:
    hibernate:
      ddl-auto: update
      
    show-sql: true    
     
#指定mybatis映射文件的地址
mybatis:
  #配置文件的路径
  #config-location: classpath:mybatis-config.xml
  mapper-locations: classpath:mapper/*.xml 
  # mybatis自动扫描包中的实体类,自动定义别名,别名是类名(首字母大写或小写都可以,一般用小写)
  type-aliases-package: com.cxb.model
  

#pagehelper分页插件配置
pagehelper:
  helper-dialect: mysql
  reasonable: true
  support-methods-arguments: true
  params: countSql
  
  
  
  
    

 

 

package com.cxb.controller;


import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;


//页面跳转不能使用 @RestController  而是使用@Controller
@Controller
@RequestMapping("/home")
public class HomeController {

@RequestMapping(value="/index", method=RequestMethod.GET)
//加了@ResponseBody 就是返回字符串了
public String index(ModelMap map) {
//返回值给页面
map.addAttribute("name", "小石潭记");
return "index";
}

@RequestMapping(value="/error", method=RequestMethod.GET)
@ResponseBody
public String error() {
return "sorry error";
}
}

 

 

 

package com.cxb;


import org.springframework.boot.builder.SpringApplicationBuilder;
import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;


public class ServletInitializer extends SpringBootServletInitializer {


@Override
protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
return application.sources(SpringBootThymeleafApplication.class);
}

 

}

 

 

//直接启动这个类就可以了

package com.cxb;


import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.EnableAutoConfiguration;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.autoconfigure.jdbc.DataSourceAutoConfiguration;


@SpringBootApplication
//没有连接数据库的时候报错  需要加上这一句
@EnableAutoConfiguration(exclude={DataSourceAutoConfiguration.class})
public class SpringBootThymeleafApplication {


public static void main(String[] args) {
SpringApplication.run(SpringBootThymeleafApplication.class, args);
}

}

 

 

//很简单的css

style.css:

.login-title{
font-size: 30px;
color: red;

}

 

//很简单的js

home.js:

alert("1");

 

 

index.html:





Index thymeleaf




HELLO INDEX THYMELEAF


你好,



 

 

访问链接:http://localhost:8080/home/index

SpringBoot --thymeleaf(资源文件css、js的引入)_第2张图片

 

 

总结:在引入模板引擎依赖的时候,没有成功   注意一下版本



   org.springframework.boot
   spring-boot-starter-thymeleaf

SpringBoot --thymeleaf(资源文件css、js的引入)_第3张图片

在引入thymeleaf依赖的时候,需要注意parent里面的版本号,我测试了使用新的2.0.4版本号依赖导入不成功,改为2.0.2就好了。

 

2.在加载资源文件的时候,如果不成功的话,就在启动类配置一下:、

SpringBoot --thymeleaf(资源文件css、js的引入)_第4张图片

这里再配置一下静态资源的路径:

页面使用:

 

 

最终结果:

SpringBoot --thymeleaf(资源文件css、js的引入)_第5张图片

 

你可能感兴趣的:(笔记)