Как заказать пакеты MVC в async-загрузке?

Я разработал сайт MVC 4. Теперь у меня возникла проблема с временем загрузки ресурсов и выполнением скриптов. Потому что библиотеки, имеющие более высокий приоритет (например, jQuery) и должны запускаться с первой, но загружаться позже других, а сценарии зависят от загруженных и запущенных ранее, вызывают ошибки!Как заказать пакеты MVC в async-загрузке?

Мои связки скриптов:

bundles.Add(new ScriptBundle("~/bundles/scripts").Include(
          "~/Scripts/jquery-{version}.js", 
          "~/Scripts/jquery-migrate.min.js", 
          "~/Scripts/jquery.unobtrusive-ajax.min.js", 
          "~/Scripts/jquery.knob.min.js", 
          "~/Scripts/toastr.min.js", 
          "~/Scripts/bootstrap.min.js", 
          "~/Scripts/respond.js", 
          "~/Scripts/bootstrap-select.min.js", 
          "~/Scripts/smoothscrool.js", 
          "~/Scripts/scrollReveal.js", 
          "~/Scripts/easing.min.js", 
          "~/Scripts/site.js")); 


bundles.Add(new ScriptBundle("~/bundles/contact").Include(
      "~/Scripts/contact.js"));

Это мой макет:

<!DOCTYPE html> 
<html lang="en"> 
<head> 

</head> 
<body> 
    @Scripts.RenderFormat("<script type=\"text/javascript\" src=\"{0}\" async></script>", "~/bundles/scripts") 

    <div id="page-content">   
     @RenderBody() 
    </div> 

    @RenderSection("scripts", required: false) 
</body> 
</html>

Как вы можете видеть, в начале тела, сценарии должны быть загружены асинхронной:

@Scripts.RenderFormat("<script type=\"text/javascript\" src=\"{0}\" async></script>", "~/bundles/scripts")

И это мои контактные данные бритвенных кодов:

@section scripts 
{ 
    @Scripts.Render("~/bundles/contact") 
} 

<div> 
    Contact Contents 
</div>

Теперь, хотя сценарий раздела загружен в конце тела. Но из-за асинхронной загрузки ресурсов зависимый скрипт загружен раньше (поскольку он более компактен, чем сценарии макета) и вызвал ошибку!

Как заставить зависимые скрипты запускать после запуска всех асинхронных скриптов макета??

источник

2016-11-05 Behzad

Звучит, как вы хотите, чтобы вещь просто выплевывала один тег/файл со всем, что было заказано правильно. https://msdn.microsoft.com/en-us/library/system.web.optimization.scripts.renderformat(v=vs.110).aspx * RenderFormat генерирует теги сценариев для предоставленных путей с использованием указанной строки формата. Он генерирует несколько тегов сценариев для каждого элемента в пакете, если для параметра EnableOptimizations установлено значение false. Когда оптимизация включена, он генерирует один тег сценария к URL-адресу с меткой версии, который представляет весь пакет. Однако вам понадобится один пакет для каждого вида с помощью скриптов. –

@ ta.speot.is EnableOptimizations - это правда. Мой скрипт contact.js, который используется только в контакте «Контакт». Итак, это право добавить его в пакет компоновки, тогда этот скрипт загружается на все страницы! – Behzad

* Вам понадобится один комплект для каждого вида * –

В представлении макета вы должны добавить динамический пакет для добавления ресурсов для каждого вида, когда этот вид вызывается из макета. , другими словами, вы можете сгенерировать набор скриптов и стилей в одном файле для каждого представления, определив любые ресурсы просмотра в динамическом классе пакетов.

Для примера:

класса BundleConfig на этом пути App_Start\BundleConfig:

public class BundleConfig 
    { 
     public static void RegisterBundles(BundleCollection bundles) 
     { 
      var styles = new string[] 
      { 
       "~/Content/bootstrap.min.css", 
       "~/Content/bootstrap-select.min.css", 
       "~/Content/font-awesome.min.css", 
       "~/Content/toastr.min.css", 
       "~/Content/front.css", 
       "~/Content/style.css" 
      }; 

      var zocial = new string[] { "~/Content/zocial.css" }; 

      var gridmvc = new string[] 
      { 
       "~/Content/Gridmvc.css", 
       "~/Content/gridmvc.datepicker.min.css" 
      }; 

      bundles.Add(new StyleBundle("~/Content/stylesheets").Include(styles)); 
      bundles.Add(new StyleBundle("~/Content/stylesheets-zocial").Include(styles.Concat(zocial).ToArray())); 
      bundles.Add(new StyleBundle("~/Content/stylesheets-gridmvc").Include(styles.Concat(gridmvc).ToArray())); 


     } 
} 


public static class BundleExtensions 
{ 
     public static string GetViewBundleName(this System.Web.Mvc.HtmlHelper helper, BundleType bundleType) 
     { 
      var controller = helper.ViewContext.RouteData.Values["controller"].ToString(); 
      var action = helper.ViewContext.RouteData.Values["action"].ToString(); 

        switch (controller.ToLower()) 
        { 
         case "home": 
          { 
           switch (action.ToLower()) 
           { 
            case "index": return "~/Content/stylesheets-homepage"; 
            default: 
             return "~/Content/stylesheets"; 
           } 
          } 
         case "sitemaps": 
          return "~/Content/stylesheets-zocial"; 

         case "blogs": 
          return "~/Content/stylesheets-gridmvc"; 

         case "account": 
          return "~/Content/stylesheets-jqueryval"; 


         default: 
          return "~/Content/stylesheets"; 
        } 
     } 
}

Наконец, в макете, должен быть добавить скрипты эту модель для асинхронного:

Scripts.RenderFormat("<script type=\"text/javascript\" src=\"{0}\" async></script>", Html.GetViewBundleName(BundleType.Scripts)))

источник

2016-11-09 13:01:56

Как заказать пакеты MVC в async-загрузке?

ответ

Смежные вопросы