Question

我有一个Blazor Component库，其中包含组件和样式表。现在，我想将图像文件（静态资产）添加到库中，并从服务器端Blazor应用程序（通过NuGet）引用它。

我已经可以使用_Host.cshtml中的链接标记来处理样式表了：

<link href="_content/BlazorNugetName/css/styles.css" rel="stylesheet" />

这包括我正在使用的应用中的CSS资产。

如果我在我的应用中使用图像标签，例如：

<img src="/_content/BlazorNugetName/images/logo.png" />

或类似这样：

<img src="_content/BlazorNugetName/images/logo.png" />

当我直接引用Blazor库时，它可以工作。但是有了NuGet，我得到了404。

在_Host.cshtml中，我可能还需要一个链接标签。但是应该是什么呢？这些文档仅在示例中使用脚本和样式表，而不在图像文件中使用。我看过html链接标记的文档，但是找不到任何相关的语法。

作为实验，我尝试过：

<link href="_content/BlazorNugetName/images/logo.png" rel="prerender" />

但这没什么区别。

Answer 1

请尝试使用div代替。

这里有一个div ：（这里是内联的，通常我链接到CSS文件或在需要动态CSS时使用BlazorStyled）

X+Y,Y+Z

然后我在构造函数中设置BackgroundUrl：

<style>
    .background
    {
        background-image: url('@BackgroundUrl');
        height: 64vh;
        width: 80%;
    }
</style>

public string BackgroundUrl { get; set; }

在这里，我的项目/ Nuget包称为DataJuggler.Blazor.Components。

与此类似的东西应该起作用。

BackgroundUrl = "_content/DataJuggler.Blazor.Components/Images/DarkBackground.png";

Blazor组件库中的静态图像显示404

1 个答案: