AssetBundle with Bower packages

Yii 2.0 Installation and Setup
1

I have been pouring over the Yii 2.0 docs and guides for using the AssetBundle with Bower packages. I have not figured out what the correct way to set these up.

The example in the guide shows FontAwesome being used and has it’s own FontAwesomeAsset class. I have 5 Bower packages I am using (css and js varying) is it possible to create 1 AssetBundle class and assign them in there or is the correct way to create a AssetBundle class for each package?

2

The correct way is to create separate bundles for separate libraries.

3

Thanks Sam,

So if my packages include:

  • boostrap-datepicker

  • highcharts

  • chosen

  • fontawesome

I would create 4 bundles for all of those and then register them each individually in the view? Just making sure I am not missing something here. Or is there a way to combine them all and Register 1 bundle in the view.

4

I created a FontAwesomeAsset bundle and now I am trying to add it to my view but it doesn’t copy over the files from the vendor/bower install.

Here is what my Bundle class looks like:




<?php

namespace app\assets;


use yii\web\AssetBundle;


class FontAwesomeAsset extends AssetBundle

{

	public $sourcePath = '@bower/font-awesome';

	public $css = [

		'css/font-awesome.min.css',

	];

	public $publishOptions = [

		'only' => [

			'fonts/',

			'css/',

		]

	];

}

In My view I have::




<?php


/* @var $this \yii\web\View */

/* @var $content string */


use yii\helpers\Html;

use yii\bootstrap\Nav;

use yii\bootstrap\NavBar;

use yii\widgets\Breadcrumbs;

use app\assets\AppAsset;

use app\assets\FontAwesomeAsset;


AppAsset::register($this);

FontAwesomeAsset::register($this);

When the page runs, I see it going to web/assets/5a3e86d1/css/font-awesome.min.css but the files are not there. I even changed it to use symbolic links and nothing changed.

5

First, create bundle for each separate library then you may add these as dependencies to another bundle that rule them all such as AppAsset you may find in both basic and advanced project templates.

Try removing publishOptions and see if it helps.

6

Sam,

This has been extremely helpful. Thank you!

After I got all the assets put in as dependencies the one I was having issues with was the only one. So there is something up with that particular file that I am currently investigating.

7

Solved. I just had to run bower update --force and sync my bower packages. That solved my FontAwesome issue and now all my Assets are loading. Thanks again for the information!