Appasset Questions - Getting 404 Error On Asset Files

Yii 2.0 General Discussions
1

Hi All!

I’m trying to add my first assets to a Yii2 Advanced App, and I’m stuck.

I want to add a couple jquery plugins that I’ll need on all pages of the site. So instead of creating a new asset bundle, I’m trying to add these js files in the primary AppAsset class.

Below is what I have in my frontend/assets/AppAsset.php file.


class AppAsset extends AssetBundle

{

    public $basePath = '@webroot';

    public $baseUrl = '@web';

    public $css = [

        'css/site.css',

    ];

    public $js = [

    	'js/jquery.match-height.min.js',

    	'js/headroom.min.js',

    	'js/jquery.headroom.js',

    ];


    public $depends = [

        'yii\web\YiiAsset',

        'yii\bootstrap\BootstrapAsset',

    ];

}

I’ve also uploaded the js files to a frontend/web/js/ directory, thus my reference to the js/ folder in the file paths.

When I refresh my site, I see the new js files listed at the bottom of the page, but they are not referencing the /assets/ folder like the other js files that the Advanced App uses by default. Here is what I see at the bottom of my rendered site.


<script src="/assets/6a616a5e/jquery.js"></script>

<script src="/assets/dfe88b8c/yii.js"></script>

<script src="/js/jquery.match-height.min.js"></script>

<script src="/js/headroom.min.js"></script>

<script src="/js/jquery.headroom.js"></script>

<script src="/assets/4c218267/js/bootstrap.js"></script>

So we can see that the new js files appear to be getting added to the page, but if I click on the files to see the file contents, I get a 404 error. It would seem to me that Yii would create a reference to the files in the /assets/ directory just like it’s doing for the jquery.js and bootstrap.js files.

Any suggestions or tips on what I’m misunderstanding or not doing properly are greatly appreciated!

Many thanks!

2

Look at the default reference for the CSS file:




    public $css = [

        'css/site.css',

    ];

It doesn’t automagically add the CSS file as residing in /css/, does it?

Clearly you need to add ‘assets/’.

3

Thanks for your help Blackslider. I’m not sure I understand what you mean, and I may have not explained my issues well enough for you to understand.

I did use the default css reference as the example of how to structure js files. The reference shows a file path of ‘css/site.css’, and the file I edit resides in /frontend/web/css/. When I edit this site.css file, my changes are reflected properly on the site, so I assumed since it works it’s a good example of how to include js assets too.

I mirrored the default css setup for js files by setting the js reference in the class to be ‘js/myjsfile.js’ and then put the file in the /frontend/web/js/ directory.

frontend/web/css/site.css

frontend/web/js/myfile.js

Can you please elaborate on where I should be setting /assets/ to a file reference or path, and why I need to do it for js files when it’s not needed for the site.css file?

Thanks again for your input.

4

There is no need to use the assets folder when you have already put the files in web directory. assets is only for publishing files that are hidden from the web i.e. provided by yii or by extensions.

When configuring the AppAsset $sourcePath it will use assets dir to publish the files. Once you have configured $baseUrl and $basePath there is no need to do anything more than putting the files under the web directory.

Check this guide: http://www.yiiframework.com/doc-2.0/guide-assets.html#declaring-asset-bundles

5

Thanks CeBE. You’re confirming my understanding of the assets folder and how the AppAssets class is supposed to work. I must be missing something silly, or maybe my htaccess file is interfering somehow.

As far as I can tell, I have the js files set up just like css files. Any css file I add to the AppAssets class and then upload the file to the /frontend/web/css/ directory works perfectly. But for some reason my js files are not.

I’ll study up on the api resource you provided. It looks to be a lot of what I’ve been reading on GitHub, but i’m sure there’s something I missed :)

Thanks again for your help.

6

Yep, it was my htaccess file that needed a little lovin. Thanks again CeBe for helping me work it out!

7

Hello all

I am getting same 404 pages for yii js and bootstrap js what should i have to change for this in htaccess?

Thanks