Blazor应用程序加载boostrap-dark.css文件两次_Blazor

Blazor应用程序加载boostrap-dark.css文件两次

blazor

Blazor应用程序加载boostrap-dark.css文件两次,blazor,Blazor,将Blazor与dotnet core 3.1一起使用，并且有一个奇怪的问题，即boostrap-dark.css在访问主页时加载了两次如果您查看网络分析，您可以看到：我正在加载_Host.cshtml中部分动态的HTML标题区域，您可以看到呈现了HtmlHeadComponent： @page "/" @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers @{ Layout = null; } <!DOCTYPE htm

将Blazor与dotnet core 3.1一起使用，并且有一个奇怪的问题，即boostrap-dark.css在访问主页时加载了两次

如果您查看网络分析，您可以看到：

我正在加载_Host.cshtml中部分动态的HTML标题区域，您可以看到呈现了HtmlHeadComponent：

@page "/"
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <base href="~/" />
    <link rel="stylesheet" type="text/css" href="~/css/main.css" />

    <link rel="stylesheet" href="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/assets/owl.carousel.min.css" />
    <link rel="stylesheet" href="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/assets/owl.theme.default.min.css" />

    <script src="_content/Microsoft.AspNetCore.ProtectedBrowserStorage/protectedBrowserStorage.js">        </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://owlcarousel2.github.io/OwlCarousel2/assets/owlcarousel/owl.carousel.js">    </script>
    <script src="~/js/my.js"></script>
    <script src="~/js/ej2.min.js"></script>
    <script src="~/js/ejs.interop.min.js"></script>

    <component type="typeof(HtmlHeadComponent)" render-mode="ServerPrerendered" />
</head>
<body>
    <app>
        <component type="typeof(App)" render-mode="ServerPrerendered" />
    </app>

    <script src="_framework/blazor.server.js"></script>
</body>
</html>

@page/“
@addTagHelper*，Microsoft.AspNetCore.Mvc.TagHelpers
@{
布局=空；
}

HtmlHeadComponent.razor文件包含以下代码：

@inject AppState  AppState

@if (Store != null)
{
    <title>@Store.MetaTitleDerived</title>

    <link rel="shortcut icon" href="@Store.FavIconUrlDerived">

    <meta name="description" content="@Store.MetaDescription" />    
    <meta name="keywords" content="@Store.MetaKeywords" />
    <meta name="author" content="@Store.MetaAuthor" />
    <meta name="robots" content="@Store.MetaRobots" />

    <link rel="stylesheet" href="/css/@Store.BaseCssFilename" />
}

@code {
    public Db_Store Store => AppState?.StoreData?.StoreContainer?.Store;

    protected override async Task OnInitializedAsync()
    {
        if (Store == null)
        {
            AppState.StoreData = await AppState.GetStoreData(My.StoreId);
        }
    }
}

@inject-AppState-AppState
@如果（存储！=null）
{
@Store.MetaTitleDerived
}
@代码{
public Db_Store Store=>AppState？.StoreData？.StoreContainer？.Store；
受保护的重写异步任务OnInitializedAsync（）
{
if（Store==null）
{
AppState.StoreData=等待AppState.GetStoreData（My.StoreId）；
}
}
}

有人能告诉我问题出在哪里吗？是Blazor bug还是我做错了什么

谢谢

您可以检查页面并共享呈现的HTML吗？组件可以多次呈现，因此每次呈现时，您的css都将被下载。我会右键单击页面，然后单击查看页面源代码，查看链接是否存在两次，并从中进行调查。