我在 nopcommerce 3.80 中使用 Html.AppendScriptParts 方法的“异步”属性 Html.AppendScriptParts("~/Scripts/jquery-1.10.2.min.js ",假,真);
google PageSpeed Tools 给它一个高分，这是我所期望的:
但这似乎对网站的其他功能有影响(nivo slider 、来自 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>
最佳答案
首先，它与七钉插件无关。此问题是由于 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 进行了测试
关于javascript - nopcommerce 3.80 首屏内容中的 ender-blocking JavaScript 和 CSS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47690111/