當(dāng)使用Spring Boot結(jié)合Thymeleaf開(kāi)發(fā)Web應(yīng)用時(shí)，有時(shí)會(huì)遇到第一次訪問(wèn)頁(yè)面時(shí)CSS樣式無(wú)法正確加載的問(wèn)題。
  
    
解決方法
    
這個(gè)問(wèn)題通常是由于Thymeleaf的緩存機(jī)制導(dǎo)致的。Thymeleaf會(huì)將編譯過(guò)的HTML緩存起來(lái)，以提高性能。但是，當(dāng)引入CSS文件時(shí)，由于緩存機(jī)制，第一次訪問(wèn)頁(yè)面時(shí)可能無(wú)法加載最新的CSS文件。
    
為了解決這個(gè)問(wèn)題，可以在Thymeleaf的模板中添加一個(gè)版本號(hào)，來(lái)實(shí)現(xiàn)緩存的更新。
  
    
步驟
    
在CSS文件的URL后面添加一個(gè)查詢(xún)參數(shù)，如：
        
在應(yīng)用的啟動(dòng)類(lèi)中，配置Thymeleaf的緩存模式為不使用緩存，代碼如下：
    
        
@Configuration
public class ThymeleafConfig implements WebMvcConfigurer {    @Bean
    public ViewResolver viewResolver() {
        ThymeleafViewResolver resolver = new ThymeleafViewResolver();
        resolver.setTemplateEngine(templateEngine());
        resolver.setCharacterEncoding("UTF-8");
        return resolver;
    }    @Bean
    public TemplateEngine templateEngine() {
        SpringTemplateEngine engine = new SpringTemplateEngine();
        engine.setEnableSpringELCompiler(true);
        engine.addDialect(new LayoutDialect());
        engine.setCacheManager(nonCacheManager());
        return engine;
    }    @Bean
    public ICacheManager nonCacheManager() {
        return new NonCacheManager();
    }
}
        
    
  
    
通過(guò)以上步驟，每次更新CSS文件時(shí)只需要修改查詢(xún)參數(shù)的版本號(hào)，Thymeleaf會(huì)認(rèn)為有新的資源文件，從而重新加載CSS文件。
  
    
總結(jié)
    
通過(guò)在Thymeleaf模板中添加版本號(hào)，并禁用Thymeleaf的緩存機(jī)制，可以解決Spring Boot Thymeleaf第一次進(jìn)頁(yè)面不加載CSS的問(wèn)題。
  
    
希望本文能對(duì)你解決這個(gè)問(wèn)題有所幫助！