nopcommerce 3.80折疊式內容中的阻止發布者的JavaScript和CSS

Question

我在nopcommerce 3.80中使用Html.AppendScriptParts方法的“異步”屬性，例如Html.AppendScriptParts("~/Scripts/jquery-1.10.2.min.js",false,true);

谷歌PageSpeed工具給它一個很高的分數，這是我所期望的： 但這似乎對網站的其他功能有影響（nivo滑塊，來自Seven Spikes插件的ajax過濾器，...）

我沒有在nopcommerce中使用js和CSS捆綁功能。 你們能否告訴我，現在我的方案設計師中最好的解決方案是什么？ 任何幫助都非常有用。 非常感謝。

這是我的_Root.head.cshtml代碼：

@using Nop.Core.Domain.Common;
@using Nop.Core.Domain.Seo
@using Nop.Core.Infrastructure;
@{
    var displayMiniProfiler = EngineContext.Current.Resolve<Nop.Core.Domain.StoreInformationSettings>().DisplayMiniProfilerInPublicStore;

    Html.AppendScriptParts("~/Scripts/public.ajaxcart.js");
    Html.AppendScriptParts("~/Scripts/public.common.js");
    Html.AppendScriptParts("~/Scripts/jquery-migrate-1.2.1.min.js");
    Html.AppendScriptParts("~/Scripts/jquery-ui-1.10.3.custom.min.js");
    Html.AppendScriptParts("~/Scripts/jquery.validate.unobtrusive.min.js");
    Html.AppendScriptParts("~/Scripts/jquery.validate.min.js");
    Html.AppendScriptParts("~/Scripts/jquery-1.10.2.min.js",false,true);
    var commonSettings = EngineContext.Current.Resolve<CommonSettings>();
    if (commonSettings.RenderXuaCompatible)
    {
        Html.AppendHeadCustomParts(string.Format("<meta http-equiv=\"X-UA-Compatible\" content=\"{0}\"/>", commonSettings.XuaCompatibleValue));
    }
    var seoSettings = EngineContext.Current.Resolve<SeoSettings>();
    if (!string.IsNullOrEmpty(seoSettings.CustomHeadTags))
    {
        Html.AppendHeadCustomParts(seoSettings.CustomHeadTags);
    }
}
<!DOCTYPE html>
<html@(this.ShouldUseRtlTheme() ? Html.Raw(" dir=\"rtl\"") : null) @Html.NopPageCssClasses()>
<head>
    <title>@Html.NopTitle()</title>
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
    <meta name="description" content="@(Html.NopMetaDescription())" />
    <meta name="keywords" content="@(Html.NopMetaKeywords())" />
    <meta name="generator" content="nopCommerce" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    @Html.NopHeadCustom()
    @Html.Partial("Head")
    @Html.Widget("head_html_tag")
    @Html.NopCssFiles(this.Url, ResourceLocation.Head)
    @Html.NopScripts(this.Url, ResourceLocation.Head)
    @Html.NopCanonicalUrls()
    @Html.Action("RssHeaderLink", "News")
    @Html.Action("RssHeaderLink", "Blog")
    @Html.Action("Favicon", "Common")
    @if (displayMiniProfiler)
    {
        @StackExchange.Profiling.MiniProfiler.RenderIncludes()
    }
</head>
<body>
    @RenderBody()
    @Html.NopCssFiles(this.Url, ResourceLocation.Foot)
    @Html.NopScripts(this.Url, ResourceLocation.Foot)


</body>
</html>

Answer 1

首先，它與七個尖刺插件無關。 此問題是由於async行為。 當您將jquery文件設置為異步文件時，這意味着應用程序將不等待加載該文件並加載下一個js文件。 但是其他js文件依賴於第一個主文件，這就是您遇到錯誤的方式。

讓我們了解當前情況，默認代碼為：

Html.AppendScriptParts("~/Scripts/public.ajaxcart.js");
Html.AppendScriptParts("~/Scripts/public.common.js");
Html.AppendScriptParts("~/Scripts/jquery-migrate-1.2.1.min.js");
Html.AppendScriptParts("~/Scripts/jquery-ui-1.10.3.custom.min.js");
Html.AppendScriptParts("~/Scripts/jquery.validate.unobtrusive.min.js");
Html.AppendScriptParts("~/Scripts/jquery.validate.min.js");
Html.AppendScriptParts("~/Scripts/jquery-1.10.2.min.js");

在這種情況下，js文件的順序為：

現在異步加載jquery min js文件。

Html.AppendScriptParts("~/Scripts/jquery-1.10.2.min.js", false, true);

並檢查控制台：

進行此更改后，您將得到一個或多個錯誤。
要解決此問題，您必須基於依賴關系以特定順序加載js min文件。

注意：這個問題也是默認代碼！ 我已經使用nopCommerce 3.80和3.90進行了測試

nopcommerce 3.80折疊式內容中的阻止發布者的JavaScript和CSS

問題描述

1 個解決方案

解決方案1
1 2017-12-07 13:07:43

nopcommerce 3.80折疊式內容中的阻止發布者的JavaScript和CSS

問題描述

1 個解決方案

解決方案1 1 2017-12-07 13:07:43

解決方案1
1 2017-12-07 13:07:43