UseNodeModules is a NuGet package I put together a few years ago. The package gives you an easy way to install middleware for serving content directly from the node_modules
folder in an ASP.NET Core project.
public void Configure(IApplicationBuilder app) { app.UseNodeModules(maxAge: TimeSpan.FromSeconds(600)); }
The idea is that during development you can use npm to manage all your client-side dependencies and you can use those dependencies immediately instead of setting up a process to copy files into the wwwroot
folder. In production, you might use environment
tag helpers to serve files you’ve bundled during a build, or to use minified files from a CDN. During development, however, you don’t have to wait for bundling, minification, and copying to occur.
Here's an example with Bootstrap 4. In development we'll serve directly from the node_modules
folder. In any other environment we'll serve a minified file from a CDN, but with fallbacks to the node_modules
folder in case the CDN is unavailable.
<environment include="Development"> <link href="~/node_modules/bootstrap/dist/css/bootstrap.css" rel="stylesheet" /> </environment> <environment exclude="Development"> <link rel="stylesheet" href="//ajax.aspnetcdn.com/ajax/bootstrap/4.3.1/css/bootstrap.min.css" asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css" asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" /> </environment>
Be aware that dotnet publish
will not copy the node_modules
folder to the published output directory. You can change this behavior by adding the following to the .csproj file.
<ItemGroup> <Content Include="node_modules\**" CopyToPublishDirectory="PreserveNewest" /> </ItemGroup>
A nice side benefit of the above code is how Visual Studio users will also see node_modules
in the Solution Explorer view. Otherwise, the folder is hidden by Visual Studio, which I’ve never understood.
Thanks to Shawn Wildermuth for the help!