RequireJs quoted angular-route (1.7.3) module and dialed the wrong number all the time, torturing me for three days.

Require loads a very simple Demo of angular-route

related codes

1, html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>AngularJS  - </title>
</head>
<body ng-app="routingDemoApp">
 
    <h2>AngularJS </h2>
    <ul>
        <li><a href="-sharp!/"></a></li>
        <li><a href="-sharp!/computers"></a></li>
        <li><a href="-sharp!/printers"></a></li>
        <li><a href="-sharp!/blabla"></a></li>
    </ul>
     
    <div ng-view></div>
    <script src="bower_components/requirejs/require.js" data-main="require-config.js"></script>
</body>
</html>

2, config file

require.config({
    baseUrl: "./bower_components/",
    paths: {
        "angular": "angular/angular",
        "angular-route": "angular-route/angular-route"
    },
    shim: {
        "angular": {
            exports: "angular"
        },
        "angular-route": {
            deps: ["angular"],
            exports: "angular-route"
        },
    },
    urlArgs: "v=20180904&r=" + Math.random()
})

require(["app"]);

3, code of app

define(["angular","angular-route"],function (angular) { 
    console.log(angular);
    angular.module("routingDemoApp",["ngRoute"])
        .config(["$routeProvider", function($routeProvider){
            $routeProvider
            .when("/",{template:""})
            .when("/computers",{template:""})
            .when("/printers",{template:""})
            .otherwise({redirectTo:"/"});
        }]);
 })

4. Error message:

angular.js?v=20180904&r=0.22845383189839552:138 Uncaught Error: [$injector:modulerr] Failed to instantiate module routingDemoApp due to:
Error: [$injector:nomod] Module "routingDemoApp" 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.

https://errors.angularjs.org/1.7.3/$injector/modulerr?p0=routingDemoApp&p1=Error%3A%20%5B%24injector%3Anomod%5D%20Module%20"routingDemoApp"%20is%20not%20available!%20You%20either%20misspelled%20the%20module%20name%20or%20forgot%20to%20load%20it.%20If%20registering%20a%20module%20ensure%20that%20you%20specify%20the%20dependencies%20as%20the%20second%20argument.%0Ahttps%3A%2F%2Ferrors.angularjs.org%2F1.7.3%2F%24injector%2Fnomod%3Fp0%3DroutingDemoApp%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A138%3A12%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A2289%3A17%0A%20%20%20%20at%20ensure%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A2210%3A38)%0A%20%20%20%20at%20module%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A2287%3A14)%0A%20%20%20%20at%20http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A5016%3A22%0A%20%20%20%20at%20forEach%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A387%3A20)%0A%20%20%20%20at%20loadModules%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A5000%3A5)%0A%20%20%20%20at%20createInjector%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A4917%3A19)%0A%20%20%20%20at%20doBootstrap%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A1941%3A20)%0A%20%20%20%20at%20bootstrap%20(http%3A%2F%2F127.0.0.1%3A8080%2Fbower_components%2Fangular%2Fangular.js%3Fv%3D20180904%26r%3D0.22845383189839552%3A1962%3A12)
    at angular.js?v=20180904&r=0.22845383189839552:138
    at angular.js?v=20180904&r=0.22845383189839552:5040
    at forEach (angular.js?v=20180904&r=0.22845383189839552:387)
    at loadModules (angular.js?v=20180904&r=0.22845383189839552:5000)
    at createInjector (angular.js?v=20180904&r=0.22845383189839552:4917)
    at doBootstrap (angular.js?v=20180904&r=0.22845383189839552:1941)
    at bootstrap (angular.js?v=20180904&r=0.22845383189839552:1962)
    at angularInit (angular.js?v=20180904&r=0.22845383189839552:1847)
    at angular.js?v=20180904&r=0.22845383189839552:36223

just started to learn angular and require encountered such a pit, using online open source projects to try, can be completed, is there a problem with the 1.7.3 version or changed the interface? Call for help, gods.

May.22,2021
Menu