yii2之前端资源引入

 PS:因新项目后端使用yii2框架,不在使用纯html模板的方式搭建页面(前后端不分离模式)使用yii2的内置boostart封装模板,遂研究了一番yii2

  通过yii2官方下载的基础文件结构

    

      其中frontend 为放置前端文件的文件夹,

      /frontend/views是放置前端页面(即单页面模块的文件夹)

      /frontend/web是放置前端资源的文件夹

      /frontend/web/assets 是放置前端js资源的文件夹

      /frontend/web/css 是放置前端css资源的文件夹

      layout为存放的公共布局(例如我这文件是/frontend/views/layouts/main.php)基本这块是放置公共头尾部分所有页面都会引入至main.php 再输出至对应的路由显示页面内容

  1.在yii2中如何引入css文件至头部

    1).引入全局css:例如base.css

        首先我们找到frontend/assets/AppAsset.php  该文件用于配置主前端应用程序资产包

        在里面我们可以清晰看到如下代码

        

        其中 :

           piblic $basePath  指定包含资源包中资源文件并可Web访问的目录 例如:@webroot 指向的就是 文件名为web的根目录

           public $baseUrl   指定对应到 basePath 目录的 URL  @web 文件名为web的目录

           public $css 列出此包中包含的 CSS 文件的数组。 请注意,只应使用正斜杠“/”作为目录分隔符。每个文件都可以单独指定为字符串, 也可以与属性标记及其值一起指定在数组中  是我们需要配置的公共css文件 由图上可以看出是数组格式  路径为css/xxx.css  在执行时文件会自动匹配到frontend/web/css文件下的指定css文件

           public $depends 一个列出该资源包依赖的 其他资源包

      2).引入单页面css

        1.需要从页面指定到head标签呢

          <?php $this->registerCssFile(‘site2.css‘);?>    在需要将css指定到head内的页面写入还函数  即可将文件引入head中,该文件指向的的文件路径默认为

      

      

原文地址:https://www.cnblogs.com/jjq-exchange/p/10538655.html

时间: 2024-10-11 05:05:26

yii2之前端资源引入的相关文章

yii2中的资源....

1.模板文件中访问view和controller,view : $this,controller :$this->context 模板文件显示流程: 1.控制器会在render中,把控制器本身,模板文件传给view 2.呈现模板文件,首先view会查找主题,主题如果拥有模板文件,则优先使用主题内模板文件.并将模板文件赋值给变量$content 3.呈现布局文件,同样查找主题,并将$content作为变量导入 4.引入模板文件时,是发生在view中,所以$this就是view 2.注册资源 reg

前端资源多个产品整站一键打包&amp;包版本管理(一)

来新公司工作的第五个月.整站资源打包管理也提上了日程. 问题: 首先.什么是整站的打包管理呢? 我们公司的几个重要产品都在同一个webapp里面,但是,不同的开发部门独立开发不同的产品,长期以来,我们就不知道其他部门的在做什么,或许我们正在头疼的问题,隔壁部门已经早早解决了呢? 各个部门的前端资源也是到处都是.难以管理.于是就提出了整站资源共享.整站资源共享的前提就是资源打包能统一.在几个产品里面.既有使用grunt的也有使用glup的,各个产品引入的包的版本也不一样. 目标: 统一打包工具 对

基于Laravel开发博客应用系列 —— 使用Bower+Gulp集成前端资源

本节我们将讨论如何将前端资源集成到项目中,包括前端资源的发布和引入.本项目将使用 Bower 和 Gulp 下载和集成jQuery.Bootstrap.Font Awesome 以及 DataTables. 1.“偷”别人的代码 开发 web 应用最快的方式就是借鉴别人的项目.换句话说,“偷”他们的代码. 当然,不是真偷. 举个例子吧,Twitter Bootstrap 的许可证声明允许任何人可以免费使用 Bootstrap 框架. 现在的 web 站点包含很多东西:框架.库.前端资源,等等.如

Laravel Mix编译前端资源

目前项目是使用的vue+laravel来写的,其中laravel和vue分别放了一个目录,但是这样有个问题,那就是vue需要经常更新,不然运行项目会经常出现各种问题,这里就看了看laravel的文档,才知道还有Mix这个组件,进行编译前后端资源.下载完成后的目录和laravel是一样的,只是在根目录下面有一个node_models目录. 安装: 安装Node,首先要确保自己的电脑上面有安装Node. 使用:node -v    和   npm -v查看是否有版本号,有即表示有安装Node,否则需

前端资源教程合集

综合类 前端知识体系 前端知识结构 Web前端开发大系概览 Web前端开发大系概览-中文版 Web Front-end Stack v2.2 En类资源汇总 免费的编程中文书籍索引 前端书籍 前端免费书籍大全 前端知识体系 免费的编程中文书籍索引 智能社 - 精通JavaScript开发 重新介绍 JavaScript(JS 教程) 麻省理工学院公开课:计算机科学及编程导论 JavaScript中的this陷阱的最全收集--没有之一 JS函数式编程指南 JavaScript Promise迷你书

优秀前端资源备忘录

1.前端开发仓库 比较基础的前端资源,包含html css javascript及常用在线工具. 属于国内个人(诨名:小叉)的前端资源整理,是github上的开源项目. 一些常见效果较为实用,如jQuery展示类插件,Unicode在线编码,代码在线压缩等. 前端开发仓库 优秀前端资源备忘录,布布扣,bubuko.com

Yii2.0 是如何引入js和css

今天上午没事,重拾知识,此处是关于yii2.0是如何引入js 和css 使用总结 学习连接1:http://www.yiiframework.com/doc-2.0/guide-output-client-scripts.html 学习连接2:http://www.manks.top/article/yii2_load_js_css_in_end 学习连接3:http://www.yii-china.com/post/detail/39.html 问题:在开发web框架中,使用Yii2.0框架,

WEB前端资源集

原出处:http://www.cnblogs.com/zhengjialux/archive/2017/01/16/6291394.html 资源网站篇 CSDN:全球最大中文IT社区,为IT专业技术人员提供最全面的信息传播和服务平台伯乐在线:专业的IT互联网职业社区V2EX:创意工作者们的社区.这里目前汇聚了超过 75000 名主要来自互联网行业.游戏行业和媒体行业的创意工作w3school:提供基础中文 Web 技术教程前端观察:关注国内外前端设计资源和前端开发技术的专业博客前端乱炖:最专业

前端资源汇总

前端网:http://www.w3cfuns.com/ 前端网址导航:http://whycss.com/ 前端里:http://www.yyyweb.com/ 张鑫旭博客:http://www.zhangxinxu.com/php/ 迷渡:http://justjavac.com/ 梦想天空博客:http://www.cnblogs.com/lhb25/ 前端知识体系:http://ecomfe.duapp.com/ 前端资源分享:https://github.com/hacke2    ht