2.0的變化相信大家都看到了，其中對一個資源包概念做出了很完美的實現(xiàn)，那就是AssetBundle，但是很多初學(xué)者朋友可能不太能夠正確的領(lǐng)會其中的含義

我畫了一張圖，大家可以將就看一下：

其中，控制器動作的視圖（view）渲染順序是優(yōu)先于我們的模板頁（layout）的，那么一旦我們在某個視圖中使用了新的JS庫，或新的CSS樣式文件，那么我們?nèi)绾稳ヌ幚砟兀?/p>

以下方式是錯誤的，請避免使用：有的人會直接在視圖里添加對css或者js的link引用，這樣引入的文件是在視圖區(qū)域，而yii的默認(rèn)JS加載會放在模板頁的最后，這樣可能導(dǎo)致依賴關(guān)系混亂。比如你視圖中引用的js文件里調(diào)用了jquery包，但是執(zhí)行時jquery的加載代碼在HTML頁面的末尾，這樣導(dǎo)致頁面腳本錯誤。

還有人會圖省事，直接把項目中所有的js或css文件都書寫layout模板頁里，這樣產(chǎn)生大量的無效樣式或js，影響了加載效率及頁面錯位風(fēng)險。

所以正確的方式應(yīng)該是通過AssetBundle去解決這個問題，先發(fā)一個簡單的類給大家看一下：

namespace appassets;use yiiwebAssetBundle;class AppAsset extends AssetBundle { public $basePath = ’@webroot’; public $baseUrl = ’@web’; public $css = [’public/skin/default_skin/css/theme.css’, ]; public $js = [’public/vendor/jquery/jquery-1.11.1.min.js’,’public/vendor/jquery/jquery_ui/jquery-ui.min.js’,’public/js/bootstrap/bootstrap.min.js’, ]; //依賴包 public $depends = [//這里寫你的依賴包即可，沒有就別寫 ]; //導(dǎo)入當(dāng)前頁的功能js文件，注意加載順序，這個應(yīng)該最后調(diào)用 public static function addPageScript($view, $jsfile) {$view->registerJsFile($jsfile, [AppAsset::className(), ’depends’ => ’appassetsAppAsset’]); } //導(dǎo)入編輯器 public static function addCkeditor($view) {$view->registerJsFile(’/public/js/utility/ckeditor/ckeditor.js’, [AppAsset::className(), ’depends’ => ’appassetsAppAsset’]); } }可以看到上面我創(chuàng)建的類中已經(jīng)預(yù)定義了兩個靜態(tài)方法addPageScript和addCkeditor，其中addCkeditor是一個第三方的js組件，是個編輯器，具體的開發(fā)環(huán)境中你們可以寫別的方法名及加載別的組件。那么上的這個東西寫好后應(yīng)該如何去使用呢？我們在模板頁開頭部分加上這句話：//自動加載資源AppAsset::register($this);這樣會在模板頁加載基礎(chǔ)的項目資源文件，比如css和js什么的?，F(xiàn)在我們有一個視圖叫create-mail，需要使用ckeditor編輯器，那么我們應(yīng)該在create-mail視圖的開頭加上這句話：//導(dǎo)入ckeditor包資源appassetsAppAsset::addCkeditor($this);最后解釋一下，addCkeditor（）方法是我們預(yù)先定義好的，這樣我們可以把一些常見的包都拆包并預(yù)處理好，如果你覺得麻煩可以直接使用如下的方式：//導(dǎo)入ckeditor包資源appassetsAppAsset::addPageScript($this,’js文件相對路徑或url’);以上的例子只是使用了js文件作為一個簡單的介紹，css樣式的加載也是一樣的道理。這樣做的好處是，即使在視圖里加載css或js也會因為依賴關(guān)系而出現(xiàn)在視圖外面的常規(guī)加載區(qū)域中，規(guī)范了很多。同時也因為依賴關(guān)系，你在視圖里加載的文件肯定會排在你的基礎(chǔ)樣式或腳本的后面，不會出錯。