yii2 @bower does not resolve from assetbundle file

Question

Yii2 application moved the js files to AppAsset.php file in frontend/assets. However, @bower does not get resolved to the alias.

namespace frontend\assets;

use yii\web\AssetBundle;

/**
 * @author Qiang Xue <qiang.xue@gmail.com>
 * @since 2.0
 */
class AppAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [ 
        'css/site.css',
    ];  
    public $js = [ 
        'js/script.js',
        '@bower/angular/angular.min.js',
        '@bower/angular-ui-router/release/angular-ui-router.min.js',
        '@bower/angular-bootstrap/ui-bootstrap.min.js'
    ];  
    public $depends = [ 
        'yii\web\YiiAsset',
        'yii\bootstrap\BootstrapAsset',
        'yii\web\JQueryAsset',
    ];  

}

Browser is giving 404 on http://localhost.lq/@bower/angular/angular.min.js

Answer 1

You should create new assets and set $sourcePath code like that

    class AngularAsset extends AssetBundle
    {
        public $sourcePath = '@bower/angular';
        public $js = [

            'angular.min.js',
        ];
        public $depends = [
        'frontend\assets\AppAsset',
        ];
    }

    class AngularRouterAsset extends AssetBundle
        {
            public $sourcePath = '@bower/angular-ui-router';
            public $js = [
                'release/angular-ui-router.min.js',
            ];
            public $depends = [
            'frontend\assets\AppAsset',
            ];
        }

class AngularBootstrapAsset extends AssetBundle
        {
            public $sourcePath = '@bower/angular-ui-router';
            public $js = [
                'release/ui-bootstrap.min.js',
            ];
            public $depends = [
            'frontend\assets\AppAsset',
            ];
        }
    class AngularAllAsset extends AssetBundle
            {
                public $sourcePath = '@bower/angular-ui-router';
                public $js = [
                    'js/script.js',
                ];
                public $depends = [
                'frontend\assets\AppAsset',
                'frontend\assets\AngularAsset',
                'frontend\assets\AngularRouterAsset',
                'frontend\assets\AngularBootstrapAsset',
                ];
            }