Uncaught Error: [$injector:modulerr] while using angular with require

Question

I want to use require with angular and i created a sample application for learning.My code files look like this

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>RequireJs Demo</title>

    <script src="require.js" data-main="main.js"></script>
</head>
<body ng-controller="myController">
{{message}}
</body>
</html>

main.js

require.config({
    paths: {
        angular: 'angular.min',
        angularresourse:'angular-resource.min'
    },
    
    shim: {
        angularresourse:['angular'],
        "angular": {
            exports: "angular"
        }
    }
});
require(['angular', 'module'],
    function () {
        angular.bootstrap(document, ['app']);
    }
);

module.js

define(['angular', 'controller'], function (angular,controller) {
    angular.module('app',[])
        .controller('myController', controller);
});

controller.js

define([], function () {
    var myController = function ($scope) {
        $scope.message = "RequireJs Integrated successfully";
    };

    myController.$inject = ['$scope'];

    return myController;
});

But while executing this shows error as

"angular.min.js:6 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.8/$injector/modulerr?p0=app&p1=Error%3A%20%…ttp%3A%2F%2Flocalhost%3A8383%2FAngular_Require%2Fangular.min.js%3A20%3A390)"

Could someone help me please...

Durgpal Singh Durgpal Singh · Accepted Answer · 2016-11-18T07:31:52

In HTML use ng-app="app" like this

<html lang="en" ng-app="app">
   <head>
        <meta charset="UTF-8">
        <title>RequireJs Demo</title>

        <script src="require.js" data-main="main.js"></script>
    </head>
    <body ng-controller="myController">
    {{message}}
    </body>
</html>

add JS file in your code.

Uncaught Error: [$injector:modulerr] while using angular with require

1 Answers