我在 AngularJS 1.7.5 中有一个非常简单的项目(并尝试了 6)。
我正在使用 system.web.optimization 进行捆绑。
在关闭优化的情况下运行项目时,它工作正常。
当我打开优化时,我可能会从注入/缩小中得到错误:
错误:$injector:modulerr 模块错误
我已经从项目中删除了 virtuall 的所有内容,并且当我在 angular.js 中设置错误时的断点时,在我收到错误之前我看到的最后一次注入是 ngRoute。
我尝试了多个版本,包括已经缩小的版本。
我在项目中看到的所有需要它的东西上都使用了 $inject。
我在旧版本的 Angular 中多次使用过这个项目。(pre 1.5)并且它已经工作了。
我已经逐步完成了错误处理,它似乎总是在 ngRoute 或 ui-router 上中断。即使包括缩小版本。
当我删除脚本时,我得到了不同的错误(显然)不包括模块。
这个项目是如此简单,我无法想象我遇到了 /pages/home javascript 的问题。
在本地运行或发布时,打开优化时我会遇到同样的错误,所以我相当肯定这是一个缩小问题,我无法终生弄清楚它为什么会发生。
'use strict';
angular
.module("rpApp", ['ngRoute', 'ui.router'])
.config(function ($routeProvider, $urlRouterProvider, $locationProvider)
{
$locationProvider.hashPrefix('');
$urlRouterProvider
.otherwise('/home');
$locationProvider.html5Mode(true);
})
.run(['$http', function ($http) {
}]);
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
Home Page Using Bootstrap
</div>
</div>
</div>
(function () {
angular
.module("rpApp")
.controller('homeController', homeController);
homeController.$inject = [];
function homeController() {
var vm = this;
}
})();
(function () {
'use strict';
angular.module("rpApp")
.directive('home', homeDirective);
homeDirective.$inject = [];
function homeDirective() {
return {
restrict: 'EA',
replace: true,
scope: {},
require: '?ngModel',
controller: 'homeController',
controllerAs: 'homeVm',
templateUrl: "App/pages/home/home.html",
link: function (scope, elm, atts, c) {
//dom manipulation goes in the link function
}
};
};
})();
(function () {
'use strict';
angular
.module('rpApp')
.config(configRouteHome);
configRouteHome.$inject = [
'$routeProvider',
'$locationProvider'
];
function configRouteHome($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
template: '<div data-home></div>'
})
.when('/home', {
template: '<div data-home></div>'
});
$locationProvider.html5Mode(true);
}
})();
<script src="Scripts/jquery-1.10.2.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.6/angular.min.js">
</script>
<script src="//unpkg.com/@uirouter/angularjs/release/angular-ui- router.min.js"></script>
<script src="Scripts/ngRoute.min.js"></script>
<%: System.Web.Optimization.Scripts.Render("~/Bundles/angular") %>
<base href="/">
</head>
<body>
<div>
<div ng-view ng-cloak></div>
</div>
</body>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Optimization;
using System.Web.UI;
namespace Angular1._7
{
public class BundleConfig
{
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new
ScriptBundle("~/Bundles/angular").IncludeDirectory("~/app", "*.js",
true));
bundles.Add(new
StyleBundle("~/Bundles/css").IncludeDirectory("~/app", "*.css", true));
BundleTable.EnableOptimizations = true;
}
}
}
我希望项目能够通过添加这些最少的组件来捆绑和缩小。(ui-router 和 ng-route) 但它似乎永远不会到达 /app