如何从 C# MVC4 中的插件更改资源 (JS & CSS) URL

Question

我正在研究 nopCommerce 并注意到脚本和 css 以下列方式包含在 Root_Head.cshtml 文件中

Html.AppendCssFileParts("~/Content/smoothness/jquery-ui-1.8.17.custom.css"); 
Html.AppendScriptParts("~/Scripts/public.ajaxcart.js");
Html.AppendScriptParts("~/Scripts/public.common.js");
Html.AppendScriptParts("~/Scripts/jquery-ui.min.js");
Html.AppendScriptParts("~/Scripts/jquery.validate.unobtrusive.min.js");
Html.AppendScriptParts("~/Scripts/jquery.validate.min.js");
Html.AppendScriptParts("~/Scripts/jquery.unobtrusive-ajax.min.js");
Html.AppendScriptParts("~/Scripts/jquery-1.7.1.min.js");

在同一个文档的后期，它嵌入到了Head中：

@Html.NopCssFiles(this.Url, ResourceLocation.Head)
@Html.NopScripts(this.Url, ResourceLocation.Head)

这会生成 html 输出以将脚本/css 嵌入到页眉/页脚中，如使用相对 URL 定义的...

<link href="/Content/smoothness/jquery-ui-1.8.17.custom.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.7.1.min.js"></script>

我需要在不修改根文件的情况下将 URL 从插件更改为其他 URL。所以做完之后会是这样的：

<link href="http://someurl.com/Content/smoothness/jquery-ui-1.8.17.custom.css" rel="stylesheet" type="text/css" />
<script src="http://someurl.com/Scripts/jquery-1.7.1.min.js"></script>

关于如何从插件扩展它的任何想法？我应该如何进行？

Answer 1

我不确定 nopCommerce 是如何工作的，但如果您使用 MVC4，那么您可以使用称为捆绑和缩小的新功能

一个很大的好处是，这会将所有的 js 和 css 合并到一个文件中并进行压缩，从而提高您网站的性能

参考：http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

在 BundleConfig.cs 中，你可以这样做

        var domainUrl = "http://someurl.com"; // you can retrieve it from config file

        bundles.Add(new StyleBundle(domainUrl + "/Content/css").Include( domainUrl + "/Content/site.css"));


        bundles.Add(new StyleBundle(domainUrl + "/Content/themes/base/css").Include(
                    domainUrl + "/Content/themes/base/jquery.ui.core.css",
                    domainUrl + "/Content/themes/base/jquery.ui.resizable.css",
                    domainUrl + "/Content/themes/base/jquery.ui.selectable.css",
                    domainUrl + "/Content/themes/base/jquery.ui.accordion.css",
                    domainUrl + "/Content/themes/base/jquery.ui.autocomplete.css",
                    domainUrl + "/Content/themes/base/jquery.ui.button.css",
                    domainUrl + "/Content/themes/base/jquery.ui.dialog.css",
                    domainUrl + "/Content/themes/base/jquery.ui.slider.css",
                    domainUrl + "/Content/themes/base/jquery.ui.tabs.css",
                    domainUrl + "/Content/themes/base/jquery.ui.datepicker.css",
                    domainUrl + "/Content/themes/base/jquery.ui.progressbar.css",
                    domainUrl + "/Content/themes/base/jquery.ui.theme.css"));

        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

然后在cshtml中，可以使用下面的方法

@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/jquery")

*编辑 *

对不起，我刚刚重新看了答案，我本来可以这样做的

在您的 web.config 中

<configuration>
    <appSettings>
        <add key="resourcePath" value="http://someurl.com"/>
    </appSettings>
 . . .
</configuration>

然后在你的html中

var url = ConfigurationManager.AppSettings["resourcePath"];
Html.AppendCssFileParts( url + "/Content/smoothness/jquery-ui-1.8.17.custom.css"); 
Html.AppendScriptParts(url + "/Scripts/public.ajaxcart.js");
Html.AppendScriptParts(url + "/Scripts/public.common.js");
Html.AppendScriptParts(url + "/Scripts/jquery-ui.min.js");
Html.AppendScriptParts(url + "/Scripts/jquery.validate.unobtrusive.min.js");
Html.AppendScriptParts(url + "/Scripts/jquery.validate.min.js");
Html.AppendScriptParts(url + "/Scripts/jquery.unobtrusive-ajax.min.js");
Html.AppendScriptParts(url + "/Scripts/jquery-1.7.1.min.js");