Blazor 核心托管 - Razor Class 库项目中的所有组件都在页面上打印为 HTML

Blazor Core Hosted - all Components in Razor Class Library Project are being printed as HTML on the page

我找不到类似问题的关键字,所以我发布了一个新的关键字。

项目运行良好,突然出现下面描述的问题。我只是在编辑 Razor Class 库中的一些 Razor 文件,所以我无法追溯到我所做的任何代码修改。

问题:

我有以下项目结构:

Client、Server 和 Shared 是最初由 .NET Core 3.0 中的 Blazor 模板创建的项目。 DesktopClient 是一个与 ElectronNET 类似的 Blazor 项目,问题也发生在 there.The SharedLibrary 项目上的组件上所有项目通用的组件都已放置,问题的根源显然来自何处。

SharedLibraryClient 项目中被引用,因此我可以访问 Client[=87] 中的组件=] 项目.

发生的事情是 Razor Class 库中的组件突然停止 "compiled" 并且所有“@”都被打印为 Raw HTML 喜欢 "Counter 2" 的按钮:

[]

注意图像上有 3 个按钮。第一个位于基础 Razor 页面中,并且正在正确编译。第二个来自 SharedLibrary 项目并且 显然没有被编译,因为“@”标签没有被替换 d。第三个按钮来自 Client 项目(与基本 Razor 页面相同的项目)中的组件,并且也正常工作。

所以问题是 SharedLibrary Razor 文件没有被 "compiled".

我尝试过的:

  • 从项目中删除和添加引用;
  • 清理并重建解决方案;
  • 更新包;
  • 检查 .csproj 以查看我是否能找到任何东西 wrong/missing(对此文件没有经验,所以可能遗漏了一些东西)。
  • 创建了一个新的 Blazor Core Hosted 项目并添加了一个 Razor Class 库,其设置与该演示相同。它工作正常,所以问题出在这个项目上。依赖项和“.csproj”文件看起来非常相似。

代码:

.csproj 为客户项目:

  <PropertyGroup>
    <TargetFramework>netstandard2.0</TargetFramework>
    <OutputType>Exe</OutputType>
    <LangVersion>8.0</LangVersion>
    <Nullable>enable</Nullable>
    <RazorLangVersion>3.0</RazorLangVersion>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Blazor.Extensions.SignalR" Version="0.4.0" />
    <PackageReference Include="Microsoft.AspNetCore.Blazor" Version="3.0.0-preview9.19465.2" />
    <PackageReference Include="Microsoft.AspNetCore.Blazor.Build" Version="3.0.0-preview9.19465.2" PrivateAssets="all" />
    <PackageReference Include="Microsoft.AspNetCore.Blazor.HttpClient" Version="3.0.0-preview9.19465.2" />
    <PackageReference Include="Microsoft.AspNetCore.Blazor.DevServer" Version="3.0.0-preview9.19465.2" PrivateAssets="all" />
    <PackageReference Include="Microsoft.AspNetCore.Http.Abstractions" Version="2.2.0" />
  </ItemGroup>
  <ItemGroup>
    <ProjectReference Include="..\..\SharedLibrary\SharedLibrary.csproj" />
    <ProjectReference Include="..\Shared\ServerAPI.Shared.csproj" />
  </ItemGroup>

  <ItemGroup>
    <Content Include="..\..\SharedLibrary\Content\styles\font\**\*.*">
      <Link>wwwroot\styles\font\%(RecursiveDir)%(Filename)%(Extension)</Link>
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </Content>
    <Content Include="..\..\SharedLibrary\Content\images\system\*.*">
      <Link>wwwroot\images\system\%(RecursiveDir)%(Filename)%(Extension)</Link>
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </Content>
    <Content Include="..\..\SharedLibrary\Content\images\social\brands\*.*">
      <Link>wwwroot\images\social\brands\%(RecursiveDir)%(Filename)%(Extension)</Link>
      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
    </Content>
    <Compile Remove="bin\**" />
    <Content Remove="bin\**" />
    <EmbeddedResource Remove="bin\**" />
    <None Remove="bin\**" />
    <Content Remove="compilerconfig.json" />
  </ItemGroup>

  <ItemGroup>
    <_ContentIncludedByDefault Remove="compilerconfig.json" />
    <_ContentIncludedByDefault Remove="wwwroot\styles\main.css" />
  </ItemGroup>

  <ItemGroup>
    <Folder Include="Properties\" />
    <Folder Include="Services\" />
    <Folder Include="wwwroot\images\system\" />
    <Folder Include="wwwroot\scripts\" />
  </ItemGroup>
  <ItemGroup>
    <None Include="compilerconfig.json" />
  </ItemGroup>
  <ItemGroup>
    <Content Update="wwwroot\styles\main.css">
      <CopyToOutputDirectory>Never</CopyToOutputDirectory>
    </Content>
  </ItemGroup>

  <Target Name="CopyLinkedContentFiles" BeforeTargets="Build">
    <Copy SourceFiles="%(Content.Identity)" DestinationFiles="%(Content.Link)" SkipUnchangedFiles="true" OverwriteReadOnlyFiles="true" Condition="'%(Content.Link)' != ''" />
  </Target>

</Project>

.csproj 共享库

<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>netstandard2.0</TargetFramework>
    <OutputType>Library</OutputType>
    <IsPackable>true</IsPackable>
    <BlazorLinkOnBuild>false</BlazorLinkOnBuild>
    <LangVersion>8.0</LangVersion>
    <Nullable>enable</Nullable>
    <RazorLangVersion>3.0</RazorLangVersion>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Blazor.Extensions.SignalR" Version="0.4.0" />
    <PackageReference Include="Microsoft.AspNetCore.Blazor" Version="3.0.0-preview9.19465.2" />
    <PackageReference Include="Microsoft.AspNetCore.Blazor.Build" Version="3.0.0-preview9.19465.2" PrivateAssets="all" />
    <PackageReference Include="Microsoft.Extensions.Localization.Abstractions" Version="3.0.0" />
  </ItemGroup>

  <ItemGroup>
    <Folder Include="Content\images\social\brands\" />
    <Folder Include="Core\Login\" />
    <Folder Include="Core\Login\OAuth2\" />
    <Folder Include="Services\" />
  </ItemGroup>

  <ItemGroup>
    <Compile Update="Resources\Languages\en-US.Designer.cs">
      <DesignTime>True</DesignTime>
      <AutoGen>True</AutoGen>
      <DependentUpon>en-US.resx</DependentUpon>
    </Compile>
  </ItemGroup>

  <ItemGroup>
    <EmbeddedResource Update="Resources\Languages\en-US.resx">
      <Generator>ResXFileCodeGenerator</Generator>
      <LastGenOutput>en-US.Designer.cs</LastGenOutput>
    </EmbeddedResource>
  </ItemGroup>

</Project>

Index.razor

@page "/"

@using ServerAPI.Client.Components
@using SharedLibrary.Components.User

<h1>Counter</h1>

<p>Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

@code {
    int currentCount = 0;

    void IncrementCount()
    {
        currentCount++;
    }
}
<SocialWithFormLoginComponent />
<Counter />

SocialWithFormLoginComponent.razor 在 SharedLibrary 项目中

<h1>Counter 2</h1>

<p>Current count 2: @currentCount2</p>

<button class="btn btn-primary" @onclick="IncrementCount2">Click me 2</button>

@code {
    int currentCount2 = 0;

    void IncrementCount2()
    {
        currentCount2++;
        StateHasChanged();
        Console.WriteLine("Hello world!");
    }
}

Counter.razor 在客户项目中

<h1>Counter 3</h1>

<p>Current count 3: @currentCount3</p>

<button class="btn btn-primary" @onclick="IncrementCount3">Click me 3</button>

@code {
    int currentCount3 = 0;

    void IncrementCount3()
    {
        currentCount3++;
        StateHasChanged();
        Console.WriteLine("Hello world!");
    }
}

最终评论

如您所见,代码对于我的故障排除非常简单,但是项目却不是,因此重新创建将需要大量工作。

我有什么建议可以尝试吗?我在这里真的很困惑。

提前致谢!

更新解决方案:

事实证明,正如@dani hererra 发布的那样,我在附加的 Razor Class 库的组件文件夹中丢失了“_Imports.razor”,如下所示:

检查 Microsoft.AspNetCore.Components.Web 列在 _Imports.razor:

@using System.Net.Http
@using Microsoft.AspNetCore.Authorization
@using Microsoft.AspNetCore.Components.Authorization
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web  //<-----
@using Microsoft.JSInterop
@using _your_namespace_
@using _your_namespace_.Shared