404 with static content in Razor Class Library (RCL)

Question

I am having difficulties implementing static files in razor class library (.net Core 3.1) that are consumed by an ASP.NET Core (v3.1) application.

When trying to acc

Answer 1

I looked at your github example and fixed it. I removed the two package references in RclDemo.Library.csproj. Don't know if you need those for your full project, but at least you can maybe find out if you need them or if you need to configure something for them.

code:

    <Project Sdk="Microsoft.NET.Sdk.Razor">
        <PropertyGroup>
            <TargetFramework>netcoreapp3.1</TargetFramework>
            <AddRazorSupportForMvc>true</AddRazorSupportForMvc>
        </PropertyGroup>
        <ItemGroup>
            <!--<PackageReference Include="Microsoft.AspNetCore.Mvc" Version="2.2.0" />
            <PackageReference Include="Microsoft.Extensions.FileProviders.Embedded" Version="3.1.1" />-->
            <FrameworkReference Include="Microsoft.AspNetCore.App" />
        </ItemGroup>
    </Project>

Answer 2

I finally got it working for me. I have added a comment on the issue you have created at https://github.com/dotnet/AspNetCore.Docs/issues/16837.

The relevant parts of my now working .csproj are:

<Project Sdk="Microsoft.NET.Sdk.Razor">
  <PropertyGroup>
    <TargetFramework>netcoreapp3.1</TargetFramework>
    <AddRazorSupportForMvc>true</AddRazorSupportForMvc>
    <GenerateMvcApplicationPartsAssemblyAttributes>true</GenerateMvcApplicationPartsAssemblyAttributes>
    <RazorCompileOnBuild>true</RazorCompileOnBuild>
    <IncludeRazorContentInPack>false</IncludeRazorContentInPack>
    <GenerateEmbeddedFilesManifest>true</GenerateEmbeddedFilesManifest>
    <EnableDefaultRazorGenerateItems>true</EnableDefaultRazorGenerateItems>
  </PropertyGroup>

 <ItemGroup>
    <FrameworkReference Include="Microsoft.AspNetCore.App" />
    <PackageReference Include="Microsoft.Extensions.FileProviders.Embedded" Version="2.1.1" />
    <PackageReference Include="Microsoft.AspNetCore.StaticFiles" Version="2.1.1" />
  </ItemGroup>

  <PropertyGroup>
    <StaticWebAssetBasePath Condition="$(StaticWebAssetBasePath) == ''">/</StaticWebAssetBasePath>
  </PropertyGroup>
</Project>

Maybe not all of those settings above are required, but since it is working, I do not want to touch it too much - if it works, don't touch :-)

Now, here are other issues that were getting in the way:

• Because I wanted to test my NuGet packages locally, I wanted to first push the packages to a local repository folder so I could consume them from a test application. However, no where it is documented that dotnet nuget can also push to local directories, so I thought I would have to use the standalone nuget.exe to achieve this. Well, apparently it is not a good idea to use nuget.exe with RCL libraries. Instead, you can use:

dotnet nuget push .\bin\Release\DynamicVML.1.0.32.nupkg -s c:\Projects\nuget

(note that the -s option is described as a server URL in the documentation but it can actually be a local folder, and this is not explained)

• There are so many outdated articles and StackOverflow answers around that could set you up in the wrong path. What happened with me was that at some point I was trying to follow tutorials from different sources which turned out to be outdated for .NET Core 3.1. I ended up messing a little my project files and forgot to undo some of the changes I had made. To get it all working, make sure that:

• The views / .cshtml files have to be set to "Build Action: Content";

• The static files / js files have to be set to "Build Action: Content";

Now, to the consumer application part:

• I did not have to add webBuilder.UseStaticWebAssets(); in Program.cs as for a moment I thought I had. So my CreateHostBuilder simply looks like this:

public static IHostBuilder CreateHostBuilder(string[] args) =>
    Host.CreateDefaultBuilder(args)
        .ConfigureWebHostDefaults(webBuilder =>
        {
            webBuilder.UseStartup<Startup>();
        });

I did not have to add any of the FileProvider functionality that is described in the outdated tutorials. My ConfigureServices is as clean as this:

// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
    services.AddControllersWithViews();

    services.AddDbContext<ApplicationDbContext>(options =>
        options.UseInMemoryDatabase("BookAuthors"));
}

and my Configure is just the baseline one:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    else
    {
        app.UseExceptionHandler("/Home/Error");
        // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
        app.UseHsts();
    }
    app.UseHttpsRedirection();
    app.UseStaticFiles();

    app.UseRouting();

    app.UseAuthorization();

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllerRoute(
            name: "default",
            pattern: "{controller=Home}/{action=Index}/{id?}");
    });
}

With the above settings, everything works. I can include js files from the RCL library even though they are not physically present on the consumer project wwwroot (I know that this is documented in the current documentation, but at some point I was trying to debug the issue by adding a UseDirectoryBrowser to my configure and inspecting the contents of the served folders - this does not work, the static files from the RCL will not show up).

Also, a note for others with similar issues: with the above settings (due the last configuration block, more specifically) I can consume the static files from /. I am not using the /_content/LibraryName/... paths. In my RCL, I have the following structure

- wwwroot
---- lib
------- myFolder
---------- myScript.js

From the consumer app, I simply consume the .js file using

@section Scripts {
    <script src="~/lib/myFolder/myScript.js"></script>
}

... and it works!

Answer 3

If you remove the reference to Microsoft.AspNet.Core from the RclDemo.Library project, then everything works as expected. This is the line that should be removed from the project file:

<PackageReference Include="Microsoft.AspNetCore.Mvc" Version="2.2.0" />

If you create a new .NET Core 3.x application, you would not include this reference as it is now included as part of the Microsoft.AspNetCore.App framework reference. Static files worked differently in .NET Core 2.2 Razor Class Libraries, and I think your inclusion of the Microsoft.AspNetCore.Mvc v2.2.0 library is breaking things. There used to be additional configuration to include static files in an RCL.

Shawn

Answer 4

I follow this article and it work well. https://dev.to/j_sakamoto/how-to-deal-with-the-http-404-content-foo-bar-css-not-found-when-using-razor-component-package-on-asp-net-core-blazor-app-aai

In the Program.cs add in the StaticWebAssetsLoader to include the static file and it able load the css and javascript in the Razor library class

        public static IHostBuilder CreateHostBuilder(string[] args) =>
            Host.CreateDefaultBuilder(args)
                .ConfigureWebHostDefaults(webBuilder =>
                {
                    webBuilder.UseStartup<Startup>();
                    webBuilder.ConfigureAppConfiguration((ctx, cb) =>
                    {
                        StaticWebAssetsLoader.UseStaticWebAssets(
                          ctx.HostingEnvironment,
                          ctx.Configuration);
                    });
                });