簡體   English   中英

在vaadin的基於Spring的項目中包括CSS

[英]Including css in spring based project with vaadin

嘗試將簡單的css文件包含到vaadin路由中使用Spring Boot並擁有一個Maven項目。 當我在客戶端上加載頁面時,出現此錯誤:

Refused to apply style from 
'http://localhost:8080/frontend/css/msas_login_page.css' because its MIME 
type ('text/html') is not a supported stylesheet MIME type, and strict MIME 
checking is enabled.

當我嘗試訪問上述網址時,我將重定向到此html錯誤頁面

Could not navigate to 'css/msas_login_page.css'
Reason: Couldn't find route for 'css/msas_login_page.css'

這是我的代碼:

package com.msas.MSAS.UIControllers;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.MessageSource;
import org.springframework.web.context.annotation.SessionScope;

import com.msas.MSAS.UIControllers.Authentication.MSASLoginForm;
import com.vaadin.flow.component.dependency.StyleSheet;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.router.AfterNavigationEvent;
import com.vaadin.flow.router.AfterNavigationObserver;
import com.vaadin.flow.router.Route;

@Route("loginPage")
@VaadinSessionScope
@StyleSheet("css/msas_login_page.css")
public class MSASLoginPage extends HorizontalLayout implements
        AfterNavigationObserver {

    private static final long serialVersionUID = 8673461297922218502L;

    private MSASLoginForm loginForm;
    private VerticalLayout container;

    public MSASLoginPage(@Autowired MessageSource messageSource) {
        super();

        this.initComponents(messageSource);
    }

    private void initComponents(MessageSource messageSource) {
        this.loginForm = new MSASLoginForm(messageSource);

        this.container = new VerticalLayout();
        this.container.setDefaultHorizontalComponentAlignment(Alignment.CENTER);
        this.container.add(this.loginForm);

        this.addClassName("login-page-container");
        this.setDefaultVerticalComponentAlignment(Alignment.CENTER);
        this.setHeightFull();
        this.add(this.container);
    }

    @Override
    public void afterNavigation(AfterNavigationEvent event) {
        boolean isError = event.getLocation().getQueryParameters()
                .getParameters().containsKey("error");
        this.loginForm.setError(isError);
    }
}

這是我的項目結構:

  • src
    • 主要
      • 爪哇
        • ...
      • 資源
        • ...
      • 網絡應用
        • 前端
          • 的CSS
            • msas_login_page.css

這是css文件的內容:

.login-page-container{
}

解決了問題。

我正在使用多模塊Maven項目,而包含@SpringBootApplication並運行整個應用程序的主要方法與vaadin前端文件夾不在同一個模塊中。

解決方案是將主類移至與vaadin相同的maven模塊。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM