There seems to be a ongoing discussion about whether or not to use require.js with AngularJS, however, I have decided to implement it in my project. Currently, the project is set up and running with require, and my next step is to optimize and minify using r.js.
Upon running r.js and updating my data-main in the index.html file, I am encountering an issue where angular is undefined and I cannot proceed further.
I encountered the same problem when using the angular-require-seed. I followed the installation instructions on GitHub and created a build definition for r.js as follows:
build.js
({
baseUrl: "./app/js",
name: "main",
out: "index-built.js",
paths: {
angular: '../../bower_components/angular/angular',
'angular-scenario': '../../bower_components/angular-scenario/angular-scenario',
'angularRoute': '../../bower_components/angular-route/angular-route',
'angular-mocks': '../../bower_components/angular-mocks/angular-mocks'
}
})
Subsequently, I executed r.js with the command below at the top level of the app.
r.js.cmd -o build.js
Upon completion of r.js, I updated the data-main in index.html to be data-main="index-built.js"
Unfortunately, I am still facing the issue of angular being undefined. Can someone please guide me on where I might be going wrong?