使用 ASP.Net MVC、Visual Studio 优化 Angular 4 中的 node_modules 文件答案

【问题标题】：Optimization of node_modules files in angular 4 with ASP.Net MVC, Visual Studio使用 ASP.Net MVC、Visual Studio 优化 Angular 4 中的 node_modules 文件
【发布时间】：2017-11-25 19:25:08
【问题描述】：

我在 Visual Studio 2017 中使用 Angular 4 和 ASP.Net MVC。我试图捆绑加载页面所需的所有文件。例如

public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new StyleBundle("~/bundles/css")
                .Include(
                          "~/Assets/css/LoaderCss.css",
                          "~/Assets/css/style.css",
                          "~/Assets/css/responsive.css"
                          ));

            bundles.Add(new ScriptBundle("~/script/scripts")
                .Include(
                          "~/" + ConfigurationManager.AppSettings["JsConfiguration"],
                          "~/Assets/script/jquery.min.js",
                          "~/node_modules/core-js/client/shim.min.js",
                          "~/node_modules/zone.js/dist/zone.js",
                         "~/node_modules/systemjs/dist/system.src.js",
                         "~/systemjs.config.js"
                          ));


            BundleTable.EnableOptimizations = true;
        }

并用于_LayoutPage.cshtml

@Styles.Render("~/bundles/css")
   @Scripts.Render("~/script/scripts")

但是在加载页面时，所有必需的模块/文件都开始加载，这使得主页有点慢。这是因为延迟加载。例如

知道如何优化吗？

【问题讨论】：

标签： node.js asp.net-mvc angular visual-studio

【解决方案1】：

也许你应该开始观察元素，它们中的哪一个需要更长的时间。有时“大”文件会导致延迟。

对于 Prototypjs 框架。你可以使用

document.observe('dom:loaded', function() {
    // do something here
});

来自Prototype API documentation。

对于 node.js https://www.npmjs.com/package/observe

您甚至可以详细使用 DeveloperTools 来查找“有问题的”文件。

【讨论】：