Asset Loading (jquery)

I’m trying to implement the calendar in the AdminLte dashboard. In the example html page, the assets are loaded like this:




<!-- jQuery 3 -->

<script src="../bower_components/jquery/dist/jquery.min.js"></script>

<!-- Bootstrap 3.3.7 -->

<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script>

<!-- jQuery UI 1.11.4 -->

<script src="../bower_components/jquery-ui/jquery-ui.min.js"></script>

<!-- Slimscroll -->

<script src="../bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script>

<!-- FastClick -->

<script src="../bower_components/fastclick/lib/fastclick.js"></script>

<!-- AdminLTE App -->

<script src="../dist/js/adminlte.min.js"></script>

<!-- AdminLTE for demo purposes -->

<script src="../dist/js/demo.js"></script>

<!-- fullCalendar -->

<script src="../bower_components/moment/moment.js"></script>

<script src="../bower_components/fullcalendar/dist/fullcalendar.min.js"></script>

<!-- Page specific script -->

<script>

  $(function () {

    // more code here...

  );



In Yii, I’m loading the assets in an asset bundle like this:




class AdminLtePluginAsset extends AssetBundle

{

    public $sourcePath = '@vendor/almasaeed2010/adminlte';

    public $js = [

        'bower_components/jquery/dist/jquery.min.js',

        'bower_components/bootstrap/dist/js/bootstrap.min.js',

        'bower_components/jquery-ui/jquery-ui.min.js',

        'bower_components/jquery-slimscroll/jquery.slimscroll.min.js',

        'bower_components/fastclick/lib/fastclick.js',

        'dist/js/adminlte.min.js',

        'bower_components/moment/moment.js',

        'bower_components/fullcalendar/dist/fullcalendar.min.js',

    ];

    public $jsOptions = [

        'POS_HEAD',

    ];

}



In Firebug I can see that the assets are loading correctly with status 200. But the jquery.min.js file always loads after the page, and I’m continually getting the error:




Uncaught ReferenceError: $ is not defined



for this line:


<script>

  $(function () {

I’ve also tried


$(document).ready(function () {

but I get the same error.

Am I doing something wrong?

how about you put your code in a script file and load at the bottom of the array

That worked. Simple solution I should have thought of. Thanks!