3

多くの js ファイルを含む角度のあるアプリケーションがあります。これらのファイルをすべてバンドルするにはどうすればよいですか。

web で目にするすべての場所で、 BundleConfig を使用して js ファイルをバンドルすることを提案していますが、 asp.net で空の Web アプリケーション テンプレートを使用しています。

競合が発生せず、絶対パスと相対パスの選択に問題がないように、jsファイルを順番にバンドルする方法

4

2 に答える 2

2

完全な MVC プロジェクトである新しいプロジェクトを作成するのはどうですか (「空」ではなくテンプレートとして MVC を選択します。次に、App_Start/BundleConfig.cs の下を見て、その正確なファイルを作成し、デフォルト プロジェクトが global.asax で行うように登録します。 .cs?

グローバル.asax.cs:

BundleConfig.RegisterBundles(BundleTable.Bundles);

App_Start/BundleConfig.cs

using System.Web;
using System.Web.Optimization;

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

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/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 ScriptBundle("~/bundles/bootstrap").Include(
                      "~/Scripts/bootstrap.js",
                      "~/Scripts/respond.js"));

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

正直に言うと。これを行うには、webpack や gulp などの Node ベースのツールを使用します。バンドルを使用することはできますが、バンドルほど強力ではなく、フロントエンド ビルドでできる多くのことを見逃しています。たとえば、正しいロード順序に関しては、はるかに役立ちます。

于 2016-07-18T02:39:40.377 に答える
0

一般に、AnguarJS/ASP.NET をバンドルするには 2 つの方法があります。

  1. 上記のようなバンドルを使用して、Justsayno から BundleCollection を投稿します。
  2. grunt や gulp などの圧縮 JS ツールを使用します。サンプル。https://github.com/MarlabsInc/webapi-angularjs-spaまたは https://github.com/dchill72/NpmBowerGulpSample

それが役立つことを願っています!

于 2016-07-18T02:49:14.213 に答える