【问题标题】：Minify javascript in cshtml file asp.net core缩小cshtml文件asp.net核心中的javascript
【发布时间】：2021-06-06 11:27:53
【问题描述】：

有没有办法缩小 .cshtml 文件中“@section Scripts”标签内的 javascript？

【问题讨论】：

如果您可以添加您要缩小的示例代码会更好。

标签： javascript c# asp.net-core razor minify

【解决方案1】：

通常，Asp.net 核心应用程序使用BuildBundlerMinifier 包来捆绑和缩小静态资产（JavaScript、CSS 和图像文件）。因此，要缩小 @section Scripts 标签内的 JavaScript 脚本，您必须将脚本提取到外部脚本文件中，然后使用 BuildBundlerMinifier 来缩小 JS 文件。有关使用 BuildBundlerMinifier 的更多详细信息，请参阅Bundle and minify static assets in ASP.NET Core。

此外，您还可以尝试使用一些开源包来缩小内联 JS。如：WebMarkupMin。

您可以通过 NuGet 包管理器安装此包（根据您的应用程序版本选择包版本）：

然后，在Startup.cs文件的Configure和ConfigureServices方法中添加app.UseWebMarkupMin();和services.AddWebMarkupMin();，代码如下：

    public void ConfigureServices(IServiceCollection services)
    {
        services.AddRazorPages();

        services.AddWebMarkupMin(
       options =>
       {
           options.AllowMinificationInDevelopmentEnvironment = true;
           options.AllowCompressionInDevelopmentEnvironment = true;
       })
       .AddHtmlMinification(
           options =>
           {
               options.MinificationSettings.RemoveRedundantAttributes = true;
               options.MinificationSettings.RemoveHttpProtocolFromAttributes = true;
               options.MinificationSettings.RemoveHttpsProtocolFromAttributes = true;
           })
       .AddHttpCompression();
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/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();

        //Required using WebMarkupMin.AspNetCore5;
        app.UseWebMarkupMin();

        app.UseStaticFiles();

        app.UseRouting();
        app.UseAuthorization();
        app.UseEndpoints(endpoints =>
        {
            endpoints.MapRazorPages();
        });
    }

之后，JavaScript 脚本被缩小。截图如下：

之前：

之后：

【讨论】：

干得好，TIL bundlerminifier 也是一个 nuget 包。我通常只坚持使用 bundleconfig.json！

【解决方案2】：

有很多选择，没有更多细节很难回答哪个最适合你。

这些解决方案都不会解析 Razor 语法，或者无法自行在 cshtml 文件中的脚本 @section 块中找到您的 JS 代码。如果您需要缩小该代码，您应该将其拉入一个 JS 文件并使用 <script src=".."> 引用它

选项

Visual Studio 工具：BundlerMinifier。使用此工具，您可以捆绑和缩小 CSS 和 JS 文件。可以作为一次性操作（右键单击 -> 缩小文件），也可以创建一个 bundleconfig.json

链接：https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier

注意：此工具默认包含在 VS 2019 中，只需在 VS 2017 或更早版本上通过市场安装

其他途径通常涉及 NodeJs

GruntJs（与 Visual Studio 有一些集成）-https://gruntjs.com/
GulpJs - https://gulpjs.com/
Webpack - https://webpack.js.org/

【讨论】：