ASP.NET MVC 如何压缩 JS 和 CSS 文件

完整操作步骤如下：

1. 安装 NuGet 包：Microsoft.AspNet.Web.Optimization

2. 打开 Views 目录（如果是应用于区域，则为区域的 Views 目录）中的 web.config，在 <namespaces /> 节点中添加

   <add namespace="System.Web.Optimization" />

3. 在 App_Start 目录中创建类文件 BundleConfig.cs，更改其命名空间为应用程序的默认命名空间（即移除 .App_Start），创建方法：

   public static void RegisterBundles(BundleCollection bundles)
   {
       bundles.Add(new StyleBundle("~/虚拟路径（不能有点）").Include("~/CSS文件路径"));
       bundles.Add(new ScriptBundle("~/虚拟路径（不能有点）").Include("~/JS文件路径"));
   }

   虚拟路径应避免与页面访问路径相同。Include 可包含多个文件，效果是合并输出，注意引用的顺序。

4. 打开 Global.asax，在 Application_Start() 事件中添加代码

   BundleTable.EnableOptimizations = true; // 该设置使在开发模式中实现压缩代码，不设置则仅在发布后压缩代码
   BundleConfig.RegisterBundles(BundleTable.Bundles);

5. 视图页面中引用样式表或脚本

   @Styles.Render("~/CSS虚拟路径")
   @Scripts.Render("~/JS虚拟路径")

   使用 Render 的好处是，ASP.NET 会自动给引用地址加上参数，可在更改脚本或样式表内容后更改这些参数使浏览器缓存立即失效。

如果你的项目中已经安装并使用 Bundle，那么只需要参考第 4 步，将 BundleTable 的 EnableOptimixations 设为 true。

以下是一些常见异常的解决方法：

The name 'Styles' does not exist in the current context

The name 'Scripts' does not exist in the current context

解决：参步骤 2。

引用的样式表或脚本不存在（报 404 错误）

解决：步骤 3 中的虚拟路径不规范。