ded/script.js

How to Force Download Order ?

Closed this issue · 4 comments

I have a set of scripts
$script([
'lib/angular/angular.js',
'lib/angular/angular-ui-router.js',
'js/controllers.js',
'js/directives.js',
'js/services.js',
'js/filters.js',
'js/app.js',
'modules/posts/postModule.js',
'modules/posts/js/services.js',
'modules/posts/js/controllers.js',
'modules/posts/js/filters.js',
'modules/posts/js/directives.js'
], function() {
angular.bootstrap(document, ['test']);
});

I get the following crash :
Error: [$injector:modulerr] Failed to instantiate module spBlogger due to:
Error: [$injector:modulerr] Failed to instantiate module spBlogger.posts due to:
Error: [$injector:modulerr] Failed to instantiate module ui.router due to:
Error: [$injector:modulerr] Failed to instantiate module ui.router.state due to:
Error: [$injector:modulerr] Failed to instantiate module ui.router.router due to:
Error: [$injector:modulerr] Failed to instantiate module ui.router.util due to:
TypeError: forEach is not a function
at new $UrlMatcherFactory (http://localhost:8000/lib/angular/angular-ui-router.js:1546:3)
at invoke (http://localhost:8000/lib/angular/angular.js:3760:17)
at Object.instantiate (http://localhost:8000/lib/angular/angular.js:3771:23)
at provider (http://localhost:8000/lib/angular/angular.js:3627:36)
at Object.provider (http://localhost:8000/lib/angular/angular.js:3619:16)
at http://localhost:8000/lib/angular/angular.js:3679:37
at Array.forEach (native)

The angular-ui-router gets called before the angular.js is properly loaded i guess. So how to load all the scripts after angular is loaded completely ?

ded commented

@pravin-d I don't know why this hasn't been documented in the README, because this feature has been in this library for years.

Use script.order

$script.order(['a.js', 'b.js', 'c.js'], callback)

Thanks for the solution. Just one more question
So I want a.js to loaded before others. However b.js and c.js can be loaded in parallel. Can I use named bundle for this ? Or any other way ?

ded commented
$script('a.js', 'main-dep')

$script.ready('main-dep', function () {
  $script(['b.js', 'c.js'])
})

Thank you...