Failed to instantiate module {} due to: Error: [ng:areq] Argument 'module' is not a function, got Object

[SycaM]

I try to load ui-router-extras in angular and get this error:

Uncaught Error: [$injector:modulerr] Failed to instantiate module mainApp due to:
Error: [$injector:modulerr] Failed to instantiate module {} due to:
Error: [ng:areq] Argument 'module' is not a function, got Object

My code:

var angular = require('angular');                                                                   
var app = angular.module('mainApp', [ require('ui-router-extras'), require('angular-ui-router')]) 

ui-router-extras is installed under node_modules/ui-router-extras along with other node dependencies. My dependencies in package.json:

"dependencies": {                 
  "angular": "^1.4.7",            
  "angular-ui-router": "^0.2.15",         
  "ui-router-extras": "^0.1.0"    

Any ideas?

[ry8806]

when I use ui-router-extras (without the require fn) - I use the string 'ct.ui.router.extras'

have you tried that?!

[SycaM]

@ry8806 yeah,

var app = angular.module('mainApp', [ 'ct.ui.router.extras', require('angular-ui-router')]);

gives me the same error

[allanbond]

+1 @ry8806

use 'ct.ui.router.extras' as your dependency string. Not sure if the ordering matters, but you could try putting require('angular-ui-router) first. Though I think you'd see a different error if that was a problem.

Other than that, maybe there are issues with your build script?

[SycaM]

@allanbond It doesn't work either, it says

Failed to instantiate module ct.ui.router.extras due to:
Error: [$injector:nomod] Module 'ct.ui.router.extras' is not available!

instead. The app works by itself, it's only when I add the dependency that the problem appears.

[allanbond]

You'll still need to require ui-router extras so that it will be bundled and loaded properly. Somewhere above your module definition should be fine.

In my app, I actually require both ui-router and ui-router-extras outside of the module. The only dependency I need in my module definition is 'ct.ui.router.extras'.

require('angular-ui-router');
require('ui-router-extras');
var _ = require('lodash');

var app = angular.module('myApp', ['ct.ui.router.extras'])
 ...

[SycaM]

@allanbond Thank you so much! I wasn't aware you had to do that, as I only used require('angular-ui-router') in the module definition without any issues.