Berbagi teknologi

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

Langkah pertama adalah menggunakan mesin template thymeleaf di springboot

Impor dependensi

        <!-- thymeleaf 模板 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

Buat folder statis dan folder templat di direktori sumber daya

Konfigurasikan thymeleaf di yml

spring:
  # 模板引擎
  thymeleaf:
    mode: HTML5
    encoding: utf-8
    # 禁用缓存
    cache: false

Aktifkan akses ke file statis dalam konfigurasi

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

Kemas proyek vue

npm run build

Masukkan file statis yang sudah dikemas ke dalam folder statis, dan masukkan index.html ke dalam folder templat

Tulis perutean di pengontrol

Biarkan melompat ke halaman index.html

@Controller
@CrossOrigin
public class IndexController {
    @GetMapping("/")
    public String index(){
        return "index";
    }
}

Jalankan proyek

Masuk ke port dan akses!