Yii2使用小技巧之通过 Composer 添加 FontAwesome 字体资源
这回要说的是,如何给Yii2项目添加外部资源(externalassets),以FontAwesome为例子。
Yii2开始使用composer来做项目的依赖管理,这货是类似于NodeJS里面npm的东东,可以自动获取Github上最新版本的第三方库(比如Bootstrap啦,FontAwesome啦之类的)。按官方教程装好后,就可以开始初始化项目了。
一、初始化项目
通过Composer来初始化
phpcomposer.pharcreate-project--prefer-dist--stability=devyiisoft/yii2-app-basicbasic
然后开始码代码,ModelControllerView神马的,此处按下不表。
二、安装FontAwesome
终于,你的项目发展到需要引用第三方库了,我们仍然通过Composer来安装。搜索packagist.org官方的包列表,我们找到了FontAwesome的配置。将FortAwesome/Font-Awesome":"*"添加到项目的composer.json配置文件里。
//... "require":{ "php":">=5.4.0", "hybridauth/hybridauth":"dev-master", "FortAwesome/Font-Awesome":"*",//<-这里 "yiisoft/yii2":"*", "yiisoft/yii2-swiftmailer":"*", "yiisoft/yii2-bootstrap":"*", "yiisoft/yii2-debug":"*", "yiisoft/yii2-gii":"*" }, //...
然后运行
phpcomposer.pharupdate
从Github上拉取FontAwesome的包到项目本地。
三、创建FontAwesome资源包(assetbundle)
为了使用这些库,我们需要在项目的/assets目录下创建一个FontAwesomeAsset.php
namespaceassets; useyii\web\AssetBundle; classFontAwesomeAssetextendsAssetBundle { //下面这些资源文件并不在web目录下,浏览器无法直接访问。所以我们需要 //指定sourcePath属性。注意@vendor这个alias,表示vender目录 public$sourcePath='@vendor/fortawesome/font-awesome'; public$css=[ 'css/font-awesome.css', ]; }
四、注册文件,引入资源
有两种方法。第一种,当你想在某一个特定页面引入这个资源包
//这两句直接写在那一页的view里 useassets\FontAwesomeAsset; FontAwesomeAsset::register($this);
第二种,在你的网站全局引入,或者将其作为另一个资源的依赖引用。在项目的asset/AppAsset.php中加上它:
classAppAssetextendsAssetBundle { public$basePath='@webroot'; public$baseUrl='@web'; public$css=[ 'css/site.css', ]; public$js=[ ]; public$depends=[ 'yii\web\YiiAsset', 'yii\bootstrap\BootstrapAsset', //在这里加上我们的FontAwesomeAsset包类 'assets\FontAwesomeAsset' ]; }
刷新页面,看看是不是已经引入了对应的css、js资源。