首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Yii2 -在AssetBundle中添加外部js和css,显示404not found错误

Yii2 -在AssetBundle中添加外部js和css,显示404not found错误
EN

Stack Overflow用户
提问于 2015-06-04 06:12:07
回答 2查看 1.2K关注 0票数 0

这是我的Assetbundle代码。

代码语言:javascript
运行
AI代码解释
复制
public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/site.css',
        'css/normalize.css',
        'chosen/chosen.css',

    ];
    public $js = [
        'js/classie.js',
    ];

当我使用这段代码并像这样得到视图文件时,也得到了404 not found错误:

代码语言:javascript
运行
AI代码解释
复制
   > http://site.loc/frontend/web/chosen/chosen.css
   > http://site.loc/frontend/web/css/css/normalize.css
   > http://kometonline.loc/frontend/web/js/classie.js

同时,site.css运行得很好。如何纠正这个错误?

EN

回答 2

Stack Overflow用户

发布于 2015-06-04 06:45:17

这仅仅意味着文件不存在于此路径中。

将它们移动到资源束中的正确路径或更改路径。

票数 0
EN

Stack Overflow用户

发布于 2017-05-12 11:56:50

代码语言:javascript
运行
AI代码解释
复制
    $baseUrl = '@web' 

您需要将css和js文件的路径更改为

代码语言:javascript
运行
AI代码解释
复制
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'frontend/web/css/site.css',
        'frontend/web/css/css/normalize.css',
        'frontend/web/chosen/chosen.css',

];
public $js = [
    'http://kometonline.loc/frontend/web/js/classie.js',
];

或者你可以把你的css,js和directory文件夹移到你的根目录下,不改变路径。

在我的示例中,我在根目录下创建了assets文件夹,并将css、js和etc文件夹放入其中:

代码语言:javascript
运行
AI代码解释
复制
public $basePath = '@webroot';
public $baseUrl = '@web';
public $css = [
    'assets/css/main.css',
    'assets/css/custom.css',
    'assets/css/responsive.css',
];
public $js = [
    'assets/js/bootstrap.min.js',

];
public $depends = [
    'yii\web\YiiAsset',

];

如果您想覆盖和使用google的托管库,并将时间戳添加到css和js文件中,请将此添加到您的配置中。为

组件中的高级模板./frontend/config/main.php

组件中的基本模板./config/web.php

代码语言:javascript
运行
AI代码解释
复制
  'components' => [
    'assetManager' => [
        'appendTimestamp' => true, //adds timestamp to assets
        'assetMap' => [
            'jquery.js' => '//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js', //Selecting jquery
        ],
    ],

],

更多信息http://www.yiiframework.com/doc-2.0/guide-structure-assets.html

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30636239

复制
相关文章
动态加载JS 和 CSS
<script type="text/javascript"> $(function () { var filename = '/assets/css/main.css'; var fileref = document.createElement("link"); fileref.setAttribute("rel", "stylesheet"); fileref.setAttribute("type", "text/css"); fileref.setAttribute("href", filename)
逸鹏
2018/04/10
30.1K0
动态加载JS文件
const scriptEl = document.createElement('script'); scriptEl.onload = scriptEl.onreadystateschange = function () { if (!this.readyState // FF onload || this.readyState == 'loaded' || this.readyState == 'complete' // IE onreadystateschange ) {
路过君
2021/12/07
20.4K0
如何动态加载js?
第三方的js文件,自己写的js文件,js越来越多了怎么办? 提出问题: 1、js文件太多了,每个页面都写<script src="...">太麻烦。 2、如果路径变化了,或者js名称变化了怎么办?每个页面都改一遍吗? 3、如何约束js文件的加载顺序?a.js定义了一个函数,b.js要调用,但是b.js先加载了,a.js还没加载完成,造成函数未定义,无法调用。 4、js文件的合并。开发阶段,js会分成多个文件,这样便于开发。但是成熟了之后会合并成一个文件。这样引用方式就会变化,原先引用一堆js,现在只需要引用
用户1174620
2018/02/08
12.9K0
动态加载js文件简单介绍
在实际应用中,可能需要动态加载js文件,下面就介绍一下如何实现此功能。 代码实例如下: function loadDemo() { var Head = document.getElementsByTagName('HEAD')[0]; var Script = document.createElement("script"); Script.type = "text/javascript"; Script.src = "demo.js"; Head.appendChild(Script
IT工作者
2021/12/28
4.2K0
js require 动态加载 变量目录的js数据。
var temp = that.wordRow[this.wordRowIdx] ; //import(mdPath).then((m)=>{ /* import("@/data/exec/a.js").then((m)=>{ console.log(m.default)
xiny120
2022/09/23
9.5K0
vue动态加载远程js完美实践
其实vue加载远程js的教程很多,但是我比较笨呐。。。用不出来,每次都报方法/属性不存在的错误,来看一下典型的写法:
陨石坠灭
2018/10/19
9.5K0
前端 实战项目·动态加载 JS 文件
对于 Vue、React 等框架开发的单页面应用,在某些页面开发特殊功能时经常需要依赖第三方 JS 文件,如果在全局引入 CDN 资源可能会加载冗余文件,此时最好使用动态加载方式。
数媒派
2022/12/01
5.4K0
js实用方法记录-js动态加载css、js脚本文件
方法测试:openApp('ios页面','**.apk','metools://home');
易墨
2018/09/14
17.9K0
动态加载js的异步与同步方法
最近新项目需要根据参数切换js的版本,就需要动态加载js,动态加载js涉及到异步加载与同步加载的问题,所以就封装了一下下面两个方法,以供使用。
用户10106350
2022/10/28
4.8K0
js动态创建标签,并设置样式
<style type="text/css"> .content .miniNav{ position: relative; width: 100%; height: auto; border-bottom: 1px solid #e5e5e5; background: transpar
IT工作者
2022/02/08
12.6K0
js动态创建div等元素实例
为了节省时间,就直接贴代码了!希望大家多多的关注我! <html> <head> <title>js动态创建div等元素实例</title> <style type="text/css"> </style> </head> <body> <script language="javascript"> var Test={ createDiv:function(){ var div = document.createElement
业余草
2019/01/21
12.3K0
【说站】javascript如何动态加载js文件
2、通过xhr方式加载js文件,不过通过这种方式的话,就可能会面临着跨域的问题。
很酷的站长
2022/11/23
7.3K0
【说站】javascript如何动态加载js文件
JS动态加载数据绑定事件--delegate() 方法
delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。
White feathe
2021/12/08
8K0
JS动态加载数据绑定事件--delegate() 方法
动态网页常用的两种数据加载方式ajax和js动态请求
对于静态网页,我们只需要访问对应的URL就可以获得全部的数据了,动态网页则没有这么简单。比如以下网站
生信修炼手册
2020/11/02
4.8K0
动态网页常用的两种数据加载方式ajax和js动态请求
js怎么动态加载js文件(JavaScript性能优化篇)转
下面介绍一种JS代码优化的一个小技巧,通过动态加载引入js外部文件来提高网页加载速度
stys35
2019/10/29
19.8K0
JavaScript 动态加载脚本和样式
3大点: 1.元素位置 2.动态脚本 3.动态样式 一.元素位置 getBoundingClientRect()。这个方法返回一个矩形对象,包含四个属性:left、top、right和bottom。分别表示元素各边与页面上边和左边的距离。 var box = document.getElementById('box');//获取元素 alert(box.getBoundingClientRect().top);//元素上边距离页面上边的距离 alert(box.getBoundingClientRect()
汤高
2018/01/11
1.4K0
js的动态加载、缓存、更新以及复用(三)
总体思路 1、  建立一个js服务,该服务实现通用js文件的加载、依赖、缓存、更新以及复用。 2、  各个项目如果使用通用js,可(bi)以(xu)使用js服务实现加载。 3、  Js服务只提供通用的js,比如jQuery、my97、easyUI等(可根据实际情况设定具体的js文件)。 4、  其他针对特点需求写的js文件,需要自己写代码加载。Js服务可以提供加载用函数。(正在考虑要不要使用sea.js) 5、  Js服务加载的js文件,不需要做任何修改。当然也不负责各个文件里的函数名称是否冲突。   Se
用户1174620
2018/02/08
6.4K0
js的动态加载、缓存、更新以及复用(三)
js的动态加载、缓存、更新以及复用(四)
  本来想一气呵成,把加载的过程都写了,但是卡着呢,所以只好在分成两份了。   1、页面里使用<script>来加载 boot.js 。   2、然后在boot.js里面动态加载 bootLoad.js。以时间作为标识 var dateVer = date.getYear() + '_' + date.getMonth() + '_' + date.getDate() + '_' + date.getHours(); 这样可以保证一小时内肯定会被更新。同时也避免了每次都去更新。   3、boot.js里面根
用户1174620
2018/02/08
7K0
js的动态加载、缓存、更新以及复用(四)
Prism.js动态加载所需语言包
Prism是一款非常好用的前端代码高亮插件,很多开发者搭建的文章、博客分享网站中都使用到了prism.js来做代码高亮,但是在官网的下载网站选完了主题和插件后却犯了难:如果选择语言包,如果全选那么体积将近600kb如果选少了害怕以后不够用,还要来补。其次,基本上只有语言包支持Node.js环境,插件基本都是基于DOM实现没有对Node.js环境进行兼容。于是有了一个想法:通过API接口将语言包动态返回,根据前端传来的参数,主题+语言包+插件拼接后返回给前端的script和link标签。
用户6256742
2022/07/06
3.5K0
Prism.js动态加载所需语言包
js如何动态创建网页新元素
创建新元素,有两种办法,一种是直接修改父级元素的innerHTML元素,第二种是使用createElement()函数来创建,再用appendChild()函数进行DOM元素的挂载
itclanCoder
2022/12/07
4.6K0

相似问题

动态加载JS动态加载更多JS

19

动态加载CSS和JS文件

14

动态加载jQuery和插件js

10

Magento -动态加载CSS和JS

32

动态加载和卸载js文件

11
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文