3

我有一个包含很多 js 文件的 Angular 应用程序,我如何捆绑所有这些文件。

我在 web 中看到的每个地方,他们都建议使用 BundleConfig 来捆绑 js 文件,但我在 asp.net 中使用的是空的 web 应用程序模板。

js文件如何按顺序打包,不出现冲突,选择绝对路径和相对路径也不会有问题

4

2 回答 2

2

如何创建一个完整的 MVC 项目的新项目(选择 MVC 作为模板而不是“空”。然后在 App_Start/BundleConfig.cs 下查看,创建确切的文件并将其注册为 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.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 来执行此操作。您可以使用捆绑包,但它们没有那么强大,而且您错过了很多可以在前端构建中做的事情。例如,在正确的加载顺序方面,它会有所帮助。

于 2016-07-18T02:39:40.377 回答
0

通常,我们有 2 种方式来捆绑 AnguarJS/ASP.NET:

  1. 使用上面的捆绑包,来自 Justsayno 的 BundleCollection
  2. 使用像 grunt 或 gulp 这样的压缩 JS 工具。样本。https://github.com/MarlabsInc/webapi-angularjs-spahttps://github.com/dchill72/NpmBowerGulpSample

希望对您有所帮助!

于 2016-07-18T02:49:14.213 回答