环境
- Yii 2.0.15.1
- PHP 7.2.7
AppAsset
AppAsset在项目根目录下的assets文件夹内,作用是控制项目的资源文件。
资源文件也就是我们的js/css这些文件。
下面是自带的AppAsset类
namespace app\assets;
use yii\web\AssetBundle;
/**
* Main application asset bundle.
*
* @author Qiang Xue <[email protected]>
* @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',
];
}
自定义资源类
目的
创建一个资源类,作为网页布局中新的layout文件,将项目资源文件放到不可访问的文件夹内,让Yii2自动引入到web文件夹内
$sourcePath
这里配置的重点是$sourcePath
,这里定义的是源资源的位置,只定义这个之后,就会自动引入到web下的assets文件夹内。
下面是完整的资源类文件
namespace app\assets;
use yii\web\AssetBundle;
/**
* 后台管理的基本资源文件
* @package app\assets
*/
class AdminAsset extends AssetBundle
{
//资源文件的源文件位置
public $sourcePath = '@app/res';
//当前事例引入的文件
public $css = [
'assets/vendors/custom/fullcalendar/fullcalendar.bundle.css',
'assets/vendors/base/vendors.bundle.css',
'assets/demo/default/base/style.bundle.css'
];
public $js = [
'assets/vendors/base/vendors.bundle.js',
'assets/demo/default/base/scripts.bundle.js'
];
//没有依赖
public $depends = [
];
}
自动引入资源
在本文的事例中,我创建了一个新的layout文件。
下面的内容放在视图文件的最前面,即可完成对资源文件的复制,Yii2就会自动复制到web下的assets文件夹内。
use yii\helpers\Html;
use app\assets\AdminAsset;
AdminAsset::register($this);
自动引用资源
仅仅写上面的内容,是不能引入css和js文件的,还需要做下面的处理。
<head>
<?php $this->head() ?>
</head>
写在head中,让视图确定网页的head位置。这时会自动引入css文件。
<body>
<?php $this->beginBody() ?>
<?php $this->endBody() ?>
</body>
这对标签写在Body中间,让视图确认网页的Body位置.这时会在body最后自动引入js内容。
总结
这样就完成了资源引入->资源调用->视图展示的完整流程