MVC中有個專門提供JS和CSS壓縮的類,BundleCollection,其實這個類也可以在asp.net中用,
關於BundleCollection類的詳細推薦個地址:http://www.cnblogs.com/lifeil/archive/2013/03/11/2954071.html
我這里只是記錄下使用過程中遇到的兩個小問題
1.css被壓縮后,里面圖片路徑文件的問題
我們可以看到MVC中 BundleConfig這個類里,都是自動生成的好多需要壓縮的JS和CSS
bundles.Add(new StyleBundle("~/Content/Css").Include("~/Content/layout.css", "~/Content/wysiwyg.css"));
view在頭部這樣寫就可以導入 ~/Content/layout.css 和~/Content/wysiwyg.css的CSS了
@Styles.Render("~/Content/Css")
照上面方法,我繼續在后面加了個CSS,就是站點的皮膚,注意藍色位置,已經不在Content文件下級了
bundles.Add(new StyleBundle("~/Content/Css").Include("~/Content/layout.css","~/Content/wysiwyg.css", "~/Content/themes/blue/styles.css"));
這樣在開發的時候沒什么問題,因為在開發模式下CSS和JS是沒有被壓縮的,但是我把網站發布后就出問題了,
Content/themes/blue/styles.css 里圖片都是這樣寫的 background: url(img/bg_navigation.png),有人會說,為什么不寫 /Content/themes/blue/img/bg_navigation.png,如果在MVC用到了區域,這樣寫路徑也會就會出問題
如何在不發布網站的情況下測試壓縮CSS呢?在BundleConfig 類里加上
BundleTable.EnableOptimizations = true;
或修改Web.config
<compilation debug="false" targetFramework="4.0">
看看壓縮前后的CSS路徑終於發現問題了
壓縮前:

壓縮后:

原來,我們寫的 new StyleBundle("~/Content/Css") 會影響到壓縮后的路徑
解決辦法:
對於皮膚的CSS,我們重寫一個聲明
bundles.Add(new StyleBundle("~/Content/themes/blue/Css").Include("~/Content/themes/blue/styles.css"));
這樣圖片就能找到了

2.壓縮javascript文件的是時候,如果文件名帶有 .min居然不壓縮,連文件都不導入,例如
bundles.Add(new ScriptBundle("~/bundles/easyui").Include("~/Scripts/my/jquery.easyui.min.js"));
這樣的文件在壓縮后不會被導入,解決辦法
改JS名字,去掉min 或 在view里寫 @Scripts.Render("~/Scripts/my/jquery.easyui.min.js"),這樣就不會被壓縮了
其實帶min已經是被壓縮了的,如果對這個文件進行壓縮,運行里面相關方法會報錯
寫的有點亂,只是記錄下
