引用错误 $stateProvider 未定义

Reference Error $stateProvider is not defined

出于某种原因,我收到此错误:

Uncaught ReferenceError: $stateProvider is not defined

即使 angular-ui-router.js 加载正常。

这是我的代码

(function () {
    var mod = angular.module('MyApp', ['ui.router']);
    debugger;
    mod.config(['$stateProvider', '$locationProvider', function ($stateProvider, $locationProvider) {
        $stateProvider.state('product', {
            url: "/home/product",
            views: {
                "view1": {
                    templateUrl: "/Angular/Components/Products/Products.html",
                    controller: "Ctr_Products",
                }
            }
        });

    $locationProvider.html5Mode({
        enabled: true, requireBase: false
    });
}]);

这里是我的根

    <base href="/">
<script src="~/Scripts/jquery-3.3.1.js"></script>
<script src="~/Scripts/jquery-ui.js"></script>
<link href="~/Scripts/jquery-ui.css" rel="stylesheet" />
<script src="/Scripts/angular.js"></script>
<script src="/Scripts/angular-route.js"></script>
<script src="/Scripts/angular-ui-router.js"></script>

<script src="/Angular/Modules/MyApp.js"></script>
<script src="/Angular/Components/Products/Ctr_Products.js"></script>
<script src="/Angular/Factories/ProductFactory.js"></script>
<link href="/Content/bootstrap.css" rel="stylesheet" />
        (function () {
var mod = angular.module('MyApp', ['ui.router']);
debugger;
mod.config(function ($stateProvider, $locationProvider) {
        $routeProvider.when("/product", {
        controller: "Ctr_Products",
        templateUrl: "/Angular/Components/Products/Products.html"
});

$routeProvider.otherwise({ redirectTo: "/Home" });

    $locationProvider.html5Mode({
        enabled: true, requireBase: false
    });
}]);