Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Updated to Angular 1.3.0 no longer working

I am using Browserify to wrap everything up. I have just upgraded from 1.2.23 to 1.3.0 and am now getting the following errors:

Firefox Error

TypeError: angular.module is not a function

var app = angular.module('login-Controller', ['Views']);
   ----------^

Clearly says that angular is not defined. So I outputed the output from angular

var angular = require('angular'),
console.info(angular); // Object {} ='s an empty object

Does this mean that angular is no longer compatible with browserify? If it is, how can I get it working?

Detailed Error from Chrome

 Uncaught TypeError: undefined is not a function main.js:25868 C:\var\www\stage.mayfieldafc.com\src\site\js\users\loginCntrl.js.angularmain.js:1 smain.js:1 (anonymous function)main.js:28 ./src/site/js/app.js.angularmain.js:1 smain.js:1 emain.js:1 (anonymous function)
main.js:183 Uncaught Error: [$injector:modulerr] Failed to instantiate module mays due to:
Error: [$injector:nomod] Module 'mays' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.0/$injector/nomod?p0=mays
    at http://localhost:3000/js/main.js:183:12
    at http://localhost:3000/js/main.js:1900:17
    at ensure (http://localhost:3000/js/main.js:1824:38)
    at module (http://localhost:3000/js/main.js:1898:14)
    at http://localhost:3000/js/main.js:4167:22
    at forEach (http://localhost:3000/js/main.js:438:20)
    at loadModules (http://localhost:3000/js/main.js:4151:5)
    at createInjector (http://localhost:3000/js/main.js:4077:11)
    at doBootstrap (http://localhost:3000/js/main.js:1587:20)
    at bootstrap (http://localhost:3000/js/main.js:1608:12)
http://errors.angularjs.org/1.3.0/$injector/modulerr?p0=mays&p1=Error%3A%20…at%20bootstrap%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fmain.js%3A1608%3A12)main.js:183 (anonymous function)main.js:4190 (anonymous function)main.js:438 forEachmain.js:4151 loadModulesmain.js:4077 createInjectormain.js:1587 doBootstrapmain.js:1608 bootstrapmain.js:1502 angularInitmain.js:25682 (anonymous function)main.js:2845 triggermain.js:3116 eventHandler

Markup

 html(ng-app='mays)
like image 292
Jamie Hutber Avatar asked Oct 19 '14 16:10

Jamie Hutber


1 Answers

As mentioned by @JeffB, you can use browserify-shim to (hopefully temporarily) remedy this problem.

First, npm install --save-dev browserify-shim. Then, add the following to your package.json:

"browserify": {
    "transform": [
      "browserify-shim"
    ]
  },
  "browser": {
    "angular": "./node_modules/angular/angular.js"
  },
  "browserify-shim": {
    "angular": "angular"
  }

This should then let you require and access Angular as expected.

like image 159
Jakemmarsh Avatar answered Oct 07 '22 10:10

Jakemmarsh