Teknologian jakaminen

Integroi vue-projekti springboot-projektiin ja suorita se Alibaba Cloudissa

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Ensimmäinen askel on käyttää thymeleaf-mallimoottoria springbootissa

Tuo riippuvuudet

  1. <!-- thymeleaf 模板 -->
  2. <dependency>
  3. <groupId>org.springframework.boot</groupId>
  4. <artifactId>spring-boot-starter-thymeleaf</artifactId>
  5. </dependency>

Luo staattisia kansioita ja mallikansioita resurssihakemistoon

Määritä timjamilehti yml

  1. spring:
  2. # 模板引擎
  3. thymeleaf:
  4. mode: HTML5
  5. encoding: utf-8
  6. # 禁用缓存
  7. cache: false

Salli staattisten tiedostojen käyttö kokoonpanossa

  1. public class ResourceConfig implements WebMvcConfigurer {
  2. @Override
  3. public void addResourceHandlers(ResourceHandlerRegistry registry) {
  4. registry.addResourceHandler("/**").addResourceLocations("classpath:/static/");
  5. }
  6. }

Pakkaa vue-projekti

npm run build

Laita pakatut staattiset tiedostot staattiseen kansioon ja index.html mallikansioon

Kirjoita reititys ohjaimeen

Anna sen hypätä index.html-sivulle

  1. @Controller
  2. @CrossOrigin
  3. public class IndexController {
  4. @GetMapping("/")
  5. public String index(){
  6. return "index";
  7. }
  8. }

Suorita projekti

Mene porttiin ja käytä sitä!