1、初始化項目php
經過 Composer 來初始化css
composer create-project --prefer-dist yiisoft/yii2-app-basic myapp(或使用php composer.phar create-project --prefer-dist yiisoft/yii2-app-basic myappweb
2、安裝 FontAwesomejson
仍然經過 Composer 來安裝。搜索 packagist.org 官方的包列表,咱們找到了 FontAwesome 的配置。將 FortAwesome/Font-Awesome": "*"
添加到項目的 composer.json 配置文件裏。bootstrap
"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": "*" },
而後運行 composer update(或 php composer.phar update)從 Github 上拉取 FontAwesome 的包到項目本地。swift
3、建立 FontAwesome 資源包(asset bundle)瀏覽器
爲了使用這些庫,咱們須要在項目的 /assets
目錄下建立一個 FontAwesomeAsset.php
yii2
<?php namespace app\assets; use yii\web\AssetBundle; class FontAwesomeAsset extends AssetBundle { // 下面這些資源文件並不在 web 目錄下,瀏覽器沒法直接訪問。因此咱們須要 // 指定 sourcePath 屬性。注意 @vendor 這個 alias,表示 vender 目錄 public $sourcePath = '@vendor/fortawesome/font-awesome'; public $css = [ 'css/font-awesome.css', ]; }
使用資源包:app
1.在某一個特定頁面引入這個資源包composer
// 這兩句直接寫在那一頁的 view 裏 use app\assets\FontAwesomeAsset; FontAwesomeAsset::register($this);
2.在網站全局引入,或者將其做爲另外一個資源的依賴引用。在項目的 asset/AppAsset.php 中加上它:
<?php /** * @link http://www.yiiframework.com/ * @copyright Copyright (c) 2008 Yii Software LLC * @license http://www.yiiframework.com/license/ */ namespace app\assets; use yii\web\AssetBundle; /** * @author Qiang Xue <qiang.xue@gmail.com> * @since 2.0 */ class AppAsset extends AssetBundle { public $basePath = '@webroot'; public $baseUrl = '@web'; public $css = [ 'css/site.css', ]; public $js = [ ]; public $depends = [ 'yii\web\YiiAsset', 'yii\bootstrap\BootstrapAsset', 'app\assets\FontAwesomeAsset', ]; }
刷新頁面,能夠查看已經引入的 css、js 資源(以下爲谷歌瀏覽器開發者工具中顯示內容)