如何嵌入由 Razor class 库生成的范围 css 包文件？

Question

我希望嵌入范围 css 由 razor class 库项目生成的捆绑文件。该文件在构建时放置在 obj 文件夹中。我在定义正确的 msbuild 目标以在构建期间的正确时间发出嵌入式资源时遇到了挑战。

深入研究 dotnet 目标文件后，这就是我目前在 .csproj 文件中的内容。

<Target Name="EmbedScopedCss" BeforeTargets="BeforeResGen" AfterTargets="BundleScopedCssFiles">
    <ItemGroup>
        <EmbeddedResource Include="$(IntermediateOutputPath)scopedcss\bundle$(PackageId).styles.css" Type="Non-Resx" WithCulture="false" />
    </ItemGroup>
</Target>

这应该使嵌入的资源项在 BeforeResGen 目标之前发出，据我所知，这是在资源被枚举以嵌入程序集之前的最后时刻。

但是，这在构建过程中似乎运行为时过早，因为此时文件本身不存在。

我已经从 razor sdk 范围 css 目标文件中推断出 AfterTargets="BundleScopedCssFiles"，但似乎还不够。

有办法吗？

Answer 1

如果我正确理解 MSBuild 日志，负责 CSS 当前项目的包生成的目标在项目的程序集已经编译后调用。

我个人已经解决了这个问题，方法是使用一个单独的 Razor class 库项目来存储所有具有范围样式表的组件。然后我在主项目的.csproj文件中将其生成的.styles.css文件标记为EmbeddedResource：

  <PropertyGroup>
    <!-- Disable CSS bundle generation for the main project as we cannot embed it -->
    <DisableScopedCssBundling>true</DisableScopedCssBundling>

    <!-- Define the base namespace for embedded CSS bundles -->
    <ScopedCssEmbeddedResourceNamespace>$(RootNamespace).wwwroot</ScopedCssEmbeddedResourceNamespace>
  </PropertyGroup>

  <Target Name="EmbedScopedCssBundles" AfterTargets="BundleScopedCssFiles" BeforeTargets="MainResourcesGeneration">
    <!-- Search for generated *.styles.css files for the current build configuration in neighbor projects and embed them -->
    <ItemGroup>
      <ScopedCssBundle Include="$(ProjectDir)../**/$(Configuration)/**/scopedcss/bundle/*.styles.css" />
      <ScopedCssEmbeddedResource Include="@(ScopedCssBundle)"
                                 ResourceName="$(ScopedCssEmbeddedResourceNamespace).%(Filename)%(Extension)" />
      <EmbeddedResource Include="@(ScopedCssEmbeddedResource)"
                        LogicalName="%(ScopedCssEmbeddedResource.ResourceName)" />
    </ItemGroup>

    <!-- Optional messages for MSBuild log -->
    <Message Condition="'@(ScopedCssEmbeddedResource)' == ''"
             Text="No scoped CSS bundles found for $(Configuration) configuration" />
    <Message Condition="'@(ScopedCssEmbeddedResource)' != ''"
             Text="Embedding scoped CSS bundles for $(Configuration) configuration:" />
    <Message Condition="'@(ScopedCssEmbeddedResource)' != ''"
             Text="  %(ScopedCssEmbeddedResource.Identity) -> %(ScopedCssEmbeddedResource.ResourceName)" />
  </Target>

如果主项目被命名为 MyProject 并且相邻的 Razor class 库项目被命名为 MyProject.RazorLib，则上面的代码在作用域 CSS 包中的结果将是以 MyProject.wwwroot.MyProject.RazorLib.styles.css.

的名称嵌入到主项目的程序集中

这种方法的缺点是每个嵌入的 CSS 包都必须在标记中单独引用。

如何嵌入由 Razor class 库生成的范围 css 包文件？

How to embed the scoped css bundle file generated by Razor class library?

css

msbuild

razor

asp.net-core

blazor