admin管理员组

文章数量:1414604

I have a angular application with lot of js files , how can I bundle all those files.

Every where I see in web , they suggest to use BundleConfig to bundle js files but I'm using empty web application template in asp .

How to bundle js files in an order so that no conflicts would appear and there would be no problem in picking absolute paths and relative paths

I have a angular application with lot of js files , how can I bundle all those files.

Every where I see in web , they suggest to use BundleConfig to bundle js files but I'm using empty web application template in asp .

How to bundle js files in an order so that no conflicts would appear and there would be no problem in picking absolute paths and relative paths

Share Improve this question asked Jul 18, 2016 at 2:22 sudhirsudhir 1,4374 gold badges26 silver badges45 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 3

How about create a new project that is a full MVC project (select MVC as the tempalte not 'empty'. Then look under the App_Start/BundleConfig.cs, create that exact file and register it as the default project does in the global.asax.cs?

global.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./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. 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"));
        }
    }
}

To be honest though. I would use a Node based tool like webpack or gulp to do this. You CAN use bundles but they are not as powerful and you miss out on a lot of things you could do in a front-end build. It would help a lot more in terms of the correct load order for example.

In mon, we have 2 ways to bundle AnguarJS/ASP.NET:

  1. use bundle like above post BundleCollection from Justsayno
  2. Use press JS tool like grunt or gulp. Sample. https://github./MarlabsInc/webapi-angularjs-spa OR https://github./dchill72/NpmBowerGulpSample

Hope it help!

本文标签: javascriptHow to bundle js files in aspnetStack Overflow