Yii 2 —— 资源管理(Assets)

简介:

1.1.1  基本说明

参考文档:

1、http://www.yiichina.com/tutorial/399

2、http://yii2.techbrood.com/guide-assets.html

3、http://www.yiifans.com/yii2/guide/structure-assets.html

 

Yii2.0对于CSS/JS 管理,使用AssetBundle资源包类。视图如何按需加载CSS/JS ?

 

在页面中使用预先定义好的资源包类,譬如:backend/assets/AppAsset.php,使用到的CSS/JS都放在资源包里。AppAsset.php代码:

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',
     
];
 
}

 

说明:

  • $css:引入页面的CSS文件

  • $js:引入页面的JS文件

  • $depends:引入依赖的前端库

 

在加载时,$depends中的前端库先加载,$css$js中的文件后加载。一般来说,CSS放在<head></head>中加载,JS<body></body>的底部加载。CSS/JS文件的路径,存放在$basePath参数所指定的目录下,$css/$js参数指定的是相对路径。在$depends中配置的依赖库会先加载。

 

使用这种方式管理前端资源,感觉比Yii 1中的方式清爽很多,使用时,在view的文件中增加代码:

<?php
 
 
/* @var $this  \yii\web\View */
 /* @var $content string */
 
 
use backend\assets\AppAsset;
 use 
yii\helpers\Html;
 use 
yii\bootstrap\Nav;
 use 
yii\bootstrap\NavBar;
 use 
yii\widgets\Breadcrumbs;
 use 
common\widgets\Alert;
 
 
AppAsset::register($this);
 ?>

 

1.1.2  资源发布

Yiibackend/webfront/web目录下,均有assets子目录,下面有一些貌似随机数字和字符组成的目录,里面放的是一些前端库的代码,譬如jquerybootstrap等,这些子目录在应用最开始运行之前是没有的,只是访问了某些页面后就有了,这是怎么回事呢?

 

这是因为一些前端库保存的目录,在web下是不能直接被访问的,为了保证页面中可以正常使用,Yii会将这些库的文件拷贝到assets目录下。

 

哪些前端库会被拷贝呢?

这个取决于资源包的php文件中是否配置了$sourcePath参数,只有配置了$sourcePath参数,并且没有配置$basePath$baseUrl的,在执行时前端库就会被拷贝到assets目录下,并且以源目录的hash值建立子目录。

 

资源更新了怎么办?

AssetManager->hash()函数中,它是根据源目录/文件名+更新时间做hash的,所以,如果更新时间发生了变化,就会计算出新的hash值,而新的hash值所表示的目录在assets目录下不存在,因此就会建立新的目录,并且拷贝更新后的资源文件到新的目录下。

 

这样做有几个问题:

1、assets目录下的子目录可能会越来越多,存在很多垃圾目录;

解决办法:定期清除assets下的子目录。

2、更新源目录下子目录内的资源,源目录的更新时间不会改变,导致资源不会被发布;

解决办法:发布后清除assets下的子目录。

 

1.1.3  常用前端库

Yii 2中,常用的前端库:

版本号

资源包

实际资源路径

bootstrap

3.3.7

BootstrapAsset.php

vendor\bower\bootstrap\dist

jquery

2.2.4

JqueryAsset

vendor\bower\jquery\dist

 

注:BootstrapAsset中,只引入了bootstrap.css,没有引入bootstrap.js,估计是为了性能吧。






本文转自 tywali 51CTO博客,原文链接:http://blog.51cto.com/lancelot/1871256,如需转载请自行联系原作者
目录
相关文章
|
Web App开发 缓存 Java
idea和谷歌浏览器占用内存过高的处理方法
idea和谷歌浏览器占用内存过高的处理方法
7751 0
idea和谷歌浏览器占用内存过高的处理方法
|
云安全 运维 负载均衡
【纯干货】针对《等保2.0》要求的云上最佳实践——网络安全篇
伴随着国内企业上云步伐的加快,越来越多的企业需要对云上关键业务进行等级保护自查或完成相关认证。本文以《GB/T 22239-2019 信息安全技术 网络安全等级保护基本要求》中所要求的三级标准为参考,重点关注其中所涉及的网络安全高危风险部分,为企业提供阿里云上有针对性的安全建设最佳实践,助力企业构建层次化的云上网络安全防御体系,保障核心业务的安全运行。
3444 1
【纯干货】针对《等保2.0》要求的云上最佳实践——网络安全篇
|
3月前
|
缓存 API 网络安全
告别 Token 贵焦虑!保姆级教程;OpenClaw 阿里云+本地部署,付费/免费模型调教省 Token 成本指南
使用OpenClaw时,Token消耗过高是很多用户的核心痛点——收费模型效果好但成本高,免费模型成本低却能力有限。其实通过“收费模型调教+免费模型执行”的组合玩法,就能实现“Token自由”:先用收费模型打磨成熟任务流程并生成本地脚本,再切换到免费模型执行重复任务,既保证效果又节省成本,真正让免费Token玩出收费API的体验。
6259 1
|
4月前
|
人工智能 运维 机器人
Claude Sonnet4.6编程追平Opus了,价格便宜4成,老金算了笔账
![Image](https://ucc.alicdn.com/pic/developer-ecology/p3shvhj26rigq_7f903ffb487546248d74ac452521566f.jpg) OSWorld 72.5%——昨晚(2月17日)刷到这个数据的时候,老金我反复确认了三遍。 Anthropic发布了Claude Sonnet 4.6,编程能力首次追平Opus,价格却只
Claude Sonnet4.6编程追平Opus了,价格便宜4成,老金算了笔账
|
8月前
|
人工智能 供应链 数据挖掘
智能体来了+智能体成企业转型新引擎,阿里云助力产业迈向智能化未来
智能体正成为企业转型新引擎,阿里云引领产业智能化。通过融合大模型与企业场景,智能体已实现降本增效、自动化办公、精准决策,广泛应用于制造、服务、零售等领域。2024年被视为“智能体应用元年”,阿里云推动技术普惠,助力企业AI转型,培育开发人才,开启智能经济新时代。(238字)
503 2
|
vr&ar 图形学
PICO4开发实战一:节奏光剑(VR)(需求文档)
这篇文章是PICO4开发实战指南,详细介绍了开发一款名为“节奏光剑”的VR游戏的需求文档,包括从基础功能开发到交互体验优化、场景体验优化、UI设计、游戏关卡设计等多个开发阶段的详细规划和说明。
PICO4开发实战一:节奏光剑(VR)(需求文档)
|
存储 Serverless 文件存储
函数计算产品使用问题之如何在一键部署的ComfyUI中上传大模型和插件
函数计算产品作为一种事件驱动的全托管计算服务,让用户能够专注于业务逻辑的编写,而无需关心底层服务器的管理与运维。你可以有效地利用函数计算产品来支撑各类应用场景,从简单的数据处理到复杂的业务逻辑,实现快速、高效、低成本的云上部署与运维。以下是一些关于使用函数计算产品的合集和要点,帮助你更好地理解和应用这一服务。
|
虚拟化 Windows
Windows 11 24H2 中文版、英文版 (x64、ARM64) 下载 (2025 年 2 月更新)
Windows 11 24H2 中文版、英文版 (x64、ARM64) 下载 (2025 年 2 月更新)
582 4
Windows 11 24H2 中文版、英文版 (x64、ARM64) 下载 (2025 年 2 月更新)
|
人工智能 开发框架 搜索推荐
27.4K Star!这个LLM应用宝库让你秒变AI全栈高手,RAG和AI Agent一网打尽!
想要快速入门LLM应用开发?想要了解最新的RAG和AI Agent技术?这个收获27.4K Star的开源项目集合了当下最热门的LLM应用案例,从简单的PDF对话到复杂的多智能体系统应该有尽有。无论你是AI开发新手还是经验丰富的工程师,这里都能找到适合你的项目!
641 0
|
供应链 数据挖掘 BI
1688 买家订单,订单物流,订单回传接口系列(1688 寻源通 API)
1688作为国内领先的批发采购平台,提供了买家订单、订单物流及订单回传三大API接口,助力企业实现订单管理、物流跟踪和信息反馈的自动化。通过这些接口,企业可以获取订单详情、物流状态,并将处理结果回传至平台,提升运营效率。Python示例代码展示了如何使用这些接口进行数据交互,适用于电商内部管理、物流跟踪及数据分析等场景。
1050 4

热门文章

最新文章