13

これらの手順を使用して ASP.NET MVC プロジェクトを MVC4 に手動でアップグレードした後、MVC4で ASP.NET Web 最適化フレームワークの新しい CSS および JavaScript アセット バンドルと最小化機能をどのように設定しますか? デフォルトのテンプレートにはこれがすべて設定されていますが、手動で行うにはどうすればよいでしょうか?

4

2 に答える 2

31
  • [参照] を右クリックし、[NuGet パッケージの管理] をクリックして、「Microsoft.AspNet.Web.Optimization」を追加します (またはInstall-Package Microsoft.AspNet.Web.Optimization、NuGet コンソールに入力します)。
  • Web.config ファイルで、以下を に追加して<system.webServer>、縮小されたバンドルを拡張子のない URL で提供できるようにします。
<handlers>
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
<remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
<remove name="ExtensionlessUrlHandler-Integrated-4.0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
  • App_Start フォルダーに、BundleConfig.cs という新しいクラスを追加します。次のようになります。
using System.Web;
using System.Web.Optimization;

namespace MvcApplication1
{
    public class BundleConfig
    {
        // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                "~/Scripts/jquery-ui-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                "~/Scripts/jquery.unobtrusive*",
                "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));

            bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                        "~/Content/themes/base/jquery.ui.core.css"));
        }
    }
}
  • 上記を編集して必要なスクリプトとスタイルシート バンドルを追加し、次の行を using セクションと Global.asax.cs の Application_Start に追加します。
//using section
using System.Web.Optimization;

//Application_Start
BundleConfig.RegisterBundles(BundleTable.Bundles);
  • _Layout.cshtml の CSS と JavaScript およびタグを@Styles.Render("~/Content/css")およびの呼び出しに@Scripts.Render("~/bundles/jquery")置き換え、パラメーターを BundleConfig.cs に追加したバンドルの名前に置き換えます。プロジェクト内のフォルダーと同じ名前をバンドルに付けないようにしてください。

これですべての設定が完了しました。完全な機能セットの使用方法については、http ://www.asp.net/mvc/overview/performance/bundling-and-minification を参照してください。

于 2012-08-23T07:13:30.507 に答える