yii 2.0 Asset Ordering

Archives Bug Discussions
1

Not sure if this is a bug, or if i am understanding something wrong.

When i use the example on: http://www.yiiframework.com/doc-2.0/guide-structure-assets.html and add a custom javascript file to it:




<?php


namespace app\assets;


use yii\web\AssetBundle;


class AppAsset extends AssetBundle

{

    public $basePath = '@webroot';

    public $baseUrl = '@web';

    public $css = [

        'css/site.css',

    ];

    public $js = [

        'js/core.js' /* <-- added by me */

    ];

    public $depends = [

        'yii\web\YiiAsset',

        'yii\bootstrap\BootstrapAsset',

    ];

}

?>

the rendering order on the resulting HTML-page is the following:




<script src="/assets/d7917cf5/jquery.js"></script>

<script src="/assets/5bef1611/yii.js"></script>

<script src="/js/core.js"></script>

<script src="/assets/3ab85457/js/bootstrap.js"></script>

Shouldn’t the core.js file be rendered after the bootstrap.js file, because bootstrap is a dependency of the core.js file?

The order of the CSS-files in the header seems to be all right though.

Regards

2

I tried an alternative approach, which seems to be bugged too.

I removed the previously added core.js from the AppAsset class, so it is the original class like on http://www.yiiframework.com/doc-2.0/guide-structure-assets.html

If i try to add the core.js file via registerJsFile in the view:




<?php

$this->registerJsFile('@web/js/core.js',['depends'=>['app\assets\AppAsset']]);

?>

the rendering order is wrong too:




<script src="/assets/d7917cf5/jquery.js"></script>

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

<script src="/js/core.js"></script>

<script src="/assets/3ab85457/js/bootstrap.js"></script>

There has to be something wrong with the asset dependencies…

Regards

EDIT:

Using both methods the dependencies are somewhat right. The registerJSFile() is rendered after the AppAsset class core.js file. The original dependency (bootstrap) is still wrong.




$this->registerJsFile('@web/js/extend.bootstrap.js',['depends'=>['app\assets\AppAsset']]);

results in:




<script src="/assets/d7917cf5/jquery.js"></script>

<script src="/assets/5bef1611/yii.js"></script>

<script src="/js/core.js"></script>

<script src="/js/extend.bootstrap.js"></script>

<script src="/assets/3ab85457/js/bootstrap.js"></script>
3

Found it.




<?php


namespace app\assets;


use yii\web\AssetBundle;


class AppAsset extends AssetBundle

{

    public $basePath = '@webroot';

    public $baseUrl = '@web';

    public $css = [

        'css/site.css',

    ];

    public $js = [

        'js/core.js',

    ];

    public $depends = [

        'yii\web\YiiAsset',

        /*'yii\bootstrap\BootstrapAsset',*/

        'yii\bootstrap\BootstrapPluginAsset', // <- using this instead

    ];

}

?>

Somehow the yii\bootstrap\BootstrapPluginAsset (the bootstrap.js file) gets included, which has yii\bootstrap\BootstrapAsset as a dependency. It seems, as both \BootstrapPluginAsset and the original \AppAsset have \BootstrapAsset as a dependency (and the \BootstrapPluginAsset is maybe added at some point later), their only requirement is to be placed after yii.js…

Pointing out that there might be some Assets included after you added your asset dependencies in the guide, might be a good idea. (http://www.yiiframework.com/doc-2.0/guide-structure-assets.html)

Regards