asp.net Bundle功能扩展
程序员文章站
2024-03-06 14:25:08
前言 新建asp.net mvc4项目的时候,在global.asax.cs里面发现多了一句代码 bundleconfig.registerbundles(bundleta...
前言
新建asp.net mvc4项目的时候,在global.asax.cs里面发现多了一句代码
bundleconfig.registerbundles(bundletable.bundles)
google了以后终于弄清楚了这个的作用,发现这个东西确实非常实用,且功能强大,能够压缩合并js和css,但是目前的使用起来不是特别好,如果添加js或者css文件的话,需要修改bundleconfig的代码。
这里我自己简单修改了bundleconfig,对这个进行简单的扩展。
下面贴出代码:
先贴配置文件bundleconfig.xml(文件放在网站目录下路径见代码中变量bundleconfigpath)
<?xml version="1.0" encoding="utf-8" ?>
<root>
<scripts>
<script path="~/bundles/jquery">
<file>~/scripts/jquery-{version}.js</file>
</script>
<script path="~/bundles/jqueryui">
<file>~/scripts/jquery-ui-{version}.js</file>
</script>
<script path="~/bundles/jqueryval">
<file>~/scripts/jquery.unobtrusive*</file>
<file>~/scripts/jquery.validate*</file>
</script>
<script path="~/bundles/modernizr">
<file>~/scripts/modernizr-*</file>
</script>
<script path="~/bb/aa">
<file>~/views/home/addda.js</file>
</script>
</scripts>
<styles>
<style path="~/content/themes/base/css">
<file>~/content/themes/base/jquery.ui.core.css</file>
<file>~/content/themes/base/jquery.ui.resizable.css</file>
<file>~/content/themes/base/jquery.ui.selectable.css</file>
<file>~/content/themes/base/jquery.ui.accordion.css</file>
<file>~/content/themes/base/jquery.ui.autocomplete.css</file>
<file>~/content/themes/base/jquery.ui.button.css</file>
<file>~/content/themes/base/jquery.ui.dialog.css</file>
<file>~/content/themes/base/jquery.ui.slider.css</file>
<file>~/content/themes/base/jquery.ui.tabs.css</file>
<file>~/content/themes/base/jquery.ui.datepicker.css</file>
<file>~/content/themes/base/jquery.ui.progressbar.css</file>
<file>~/content/themes/base/jquery.ui.theme.css</file>
</style>
<style path="~/content/css">
<file>~/content/site.css</file>
</style>
</styles>
</root>
代码文件:bundleconfig.cs
public class bundleconfig
{
public static string bundleconfigpath = "~/config/bundleconfig.xml";
/// <summary>
/// register bundles from xml
/// </summary>
/// <param name="bundles"></param>
public static void registerbundles(bundlecollection bundles)
{
xmldocument doc = new xmldocument();
doc.load(httpcontext.current.server.mappath(bundleconfigpath));
xmlnode root = doc.documentelement;
// regester script
xmlnodelist scriptlist = root.selectnodes("scripts/script");
if (scriptlist != null && scriptlist.count > 0)
{
foreach (xmlnode node in scriptlist)
{
string path = checknoderegedit(node);
if (string.isnullorempty(path)) continue;
var bound = new scriptbundle(path);
list<string> files = getfilesformnode(node);
if (files.count > 0)
{
bound.include(files.toarray());
bundles.add(bound);
}
}
}
// regester style
xmlnodelist stylelist = root.selectnodes("styles/style");
if (stylelist != null && stylelist.count > 0)
{
foreach (xmlnode node in stylelist)
{
string path = checknoderegedit(node);
if (string.isnullorempty(path)) continue;
var bound = new stylebundle(path);
list<string> files = getfilesformnode(node);
if (files.count > 0)
{
bound.include(files.toarray());
bundles.add(bound);
}
}
}
doc = null;
}
/// <summary>
/// 如果内容为空则不添加
/// </summary>
/// <param name="node"></param>
/// <returns></returns>
private static list<string> getfilesformnode(xmlnode node)
{
list<string> files = new list<string>();
foreach (xmlnode nodefile in node.childnodes)
{
if (!string.isnullorempty(nodefile.innertext.trim()))
files.add(nodefile.innertext.trim());
}
return files;
}
/// <summary>
/// 检查注册的node
/// </summary>
/// <param name="node"></param>
/// <returns></returns>
private static string checknoderegedit(xmlnode node)
{
xmlattribute pathatt = node.attributes["path"];
string path = string.empty;
if (pathatt == null || string.isnullorempty(pathatt.value.trim()) || node.childnodes.count == 0)
return string.empty;
else
return pathatt.value.trim();
}
}
新建asp.net mvc4项目的时候,在global.asax.cs里面发现多了一句代码
bundleconfig.registerbundles(bundletable.bundles)
google了以后终于弄清楚了这个的作用,发现这个东西确实非常实用,且功能强大,能够压缩合并js和css,但是目前的使用起来不是特别好,如果添加js或者css文件的话,需要修改bundleconfig的代码。
这里我自己简单修改了bundleconfig,对这个进行简单的扩展。
下面贴出代码:
先贴配置文件bundleconfig.xml(文件放在网站目录下路径见代码中变量bundleconfigpath)
复制代码 代码如下:
<?xml version="1.0" encoding="utf-8" ?>
<root>
<scripts>
<script path="~/bundles/jquery">
<file>~/scripts/jquery-{version}.js</file>
</script>
<script path="~/bundles/jqueryui">
<file>~/scripts/jquery-ui-{version}.js</file>
</script>
<script path="~/bundles/jqueryval">
<file>~/scripts/jquery.unobtrusive*</file>
<file>~/scripts/jquery.validate*</file>
</script>
<script path="~/bundles/modernizr">
<file>~/scripts/modernizr-*</file>
</script>
<script path="~/bb/aa">
<file>~/views/home/addda.js</file>
</script>
</scripts>
<styles>
<style path="~/content/themes/base/css">
<file>~/content/themes/base/jquery.ui.core.css</file>
<file>~/content/themes/base/jquery.ui.resizable.css</file>
<file>~/content/themes/base/jquery.ui.selectable.css</file>
<file>~/content/themes/base/jquery.ui.accordion.css</file>
<file>~/content/themes/base/jquery.ui.autocomplete.css</file>
<file>~/content/themes/base/jquery.ui.button.css</file>
<file>~/content/themes/base/jquery.ui.dialog.css</file>
<file>~/content/themes/base/jquery.ui.slider.css</file>
<file>~/content/themes/base/jquery.ui.tabs.css</file>
<file>~/content/themes/base/jquery.ui.datepicker.css</file>
<file>~/content/themes/base/jquery.ui.progressbar.css</file>
<file>~/content/themes/base/jquery.ui.theme.css</file>
</style>
<style path="~/content/css">
<file>~/content/site.css</file>
</style>
</styles>
</root>
代码文件:bundleconfig.cs
复制代码 代码如下:
public class bundleconfig
{
public static string bundleconfigpath = "~/config/bundleconfig.xml";
/// <summary>
/// register bundles from xml
/// </summary>
/// <param name="bundles"></param>
public static void registerbundles(bundlecollection bundles)
{
xmldocument doc = new xmldocument();
doc.load(httpcontext.current.server.mappath(bundleconfigpath));
xmlnode root = doc.documentelement;
// regester script
xmlnodelist scriptlist = root.selectnodes("scripts/script");
if (scriptlist != null && scriptlist.count > 0)
{
foreach (xmlnode node in scriptlist)
{
string path = checknoderegedit(node);
if (string.isnullorempty(path)) continue;
var bound = new scriptbundle(path);
list<string> files = getfilesformnode(node);
if (files.count > 0)
{
bound.include(files.toarray());
bundles.add(bound);
}
}
}
// regester style
xmlnodelist stylelist = root.selectnodes("styles/style");
if (stylelist != null && stylelist.count > 0)
{
foreach (xmlnode node in stylelist)
{
string path = checknoderegedit(node);
if (string.isnullorempty(path)) continue;
var bound = new stylebundle(path);
list<string> files = getfilesformnode(node);
if (files.count > 0)
{
bound.include(files.toarray());
bundles.add(bound);
}
}
}
doc = null;
}
/// <summary>
/// 如果内容为空则不添加
/// </summary>
/// <param name="node"></param>
/// <returns></returns>
private static list<string> getfilesformnode(xmlnode node)
{
list<string> files = new list<string>();
foreach (xmlnode nodefile in node.childnodes)
{
if (!string.isnullorempty(nodefile.innertext.trim()))
files.add(nodefile.innertext.trim());
}
return files;
}
/// <summary>
/// 检查注册的node
/// </summary>
/// <param name="node"></param>
/// <returns></returns>
private static string checknoderegedit(xmlnode node)
{
xmlattribute pathatt = node.attributes["path"];
string path = string.empty;
if (pathatt == null || string.isnullorempty(pathatt.value.trim()) || node.childnodes.count == 0)
return string.empty;
else
return pathatt.value.trim();
}
}