$injector:modulerr Ошибка модуля после публикации приложения на IIS

HI У меня есть проблема, которая появляется после публикации приложения AngularJS на сервере IIS. Я считаю, что это как-то связано с обфускацией и минификацией javascript, но я не знаю, как это исправить...

Вот так выглядит мой app.js

angular.module('app', ['LocalStorageModule', 'angular-loading-bar', 'smart-table', 'mgcrea.ngStrap', 'ngAnimate', 'ngSanitize', 'ngRoute', 'ui.router', 'LocalStorageModule', 'app.filters', 'app.services', 'app.directives', 'app.controllers'])

.config(['$stateProvider', '$locationProvider', function ($stateProvider, $locationProvider) {

    $stateProvider
        .state('home', {
            url: '/',
            layout: 'basic',
            templateUrl: 'views/index',
            controller: 'HomeCtrl'

        })
        .state('putninalozi', {
            url: '/putninalozi',
            layout: 'basic',
            templateUrl: 'views/PutniNalozi',
            controller: 'PutniNaloziCtrl'
        })
        .state('profil', {
            url: '/profil',
            layout: 'basic',
            templateUrl: 'views/profil',
            controller: 'ProfilCtrl'
        })
        .state('login', {
            url: '/login',
            layout: 'basic',
            templateUrl: 'views/login',
            controller: 'LoginCtrl'
        })
        .state('signup', {
            url: '/signup',
            layout: 'basic',
            templateUrl: 'views/signup',
            controller: 'SignUpCtrl'
        })
        .state('otherwise', {
            url: '*path',
            templateUrl: 'views/404',
            controller: 'Error404Ctrl'
        });

    $locationProvider.html5Mode(true);

}])

.config(function ($httpProvider) {
    $httpProvider.interceptors.push('authInterceptorService');
})

.run(['authService', '$templateCache', '$rootScope', '$state', '$stateParams', function (authService, $templateCache, $rootScope, $state, $stateParams) {

    authService.fillAuthData();
    $rootScope.$state = $state;
    $rootScope.$stateParams = $stateParams;

}]);

И, например, один из моих контроллеров выглядит так

.controller('LoginCtrl', ['$scope', '$location', '$timeout', '$window', 'authService', function ($scope, $location, $timeout, $window, authService) {

     $scope.loginData = {
         userName: "",
         password: ""
     };

     $scope.message = "";

     $scope.login = function () {

         authService.login($scope.loginData).then(function (response) {

             $location.path('/putninalozi');

         },
          function (err) {
              $scope.message = err.error_description;
          });
     };

 }])

Есть идеи, как решить эту проблему? Спасибо за все мнения

мой BundleCOnfig.cs выглядит так

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new StyleBundle("~/content/css/app").Include("~/content/app.css")
                                                        .Include("~/content/custom.css")
                                                        .Include("~/content/loading-bar.css"));


      //  bundles.Add(new ScriptBundle("~/js/jquery").Include("~/scripts/vendor/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/js/app").Include(
              "~/scripts/vendor/angular.min.js",
              "~/scripts/vendor/smart-table.js",
              "~/scripts/vendor/angular-strap.min.js",
              "~/scripts/vendor/angular-strap.tpl.min.js",                    
              "~/scripts/app.js",
              "~/scripts/vendor/jquery-2.0.3.min.js",
              "~/scripts/vendor/angular-ui-router.js",
              "~/scripts/vendor/loading-bar.js",
              "~/scripts/vendor/angular-animate.js",
              "~/scripts/vendor/angular-route.js",
              "~/scripts/vendor/angular-sanitize.min.js",
              "~/scripts/vendor/angular-local-storage.min.js",
              "~/scripts/vendor/bootstrap.js",
              "~/scripts/controllers.js",
              "~/scripts/filters.js",
              "~/scripts/services.js",
              "~/scripts/directives.js"));
    }
}

3 ответа

У меня была такая же проблема, но я думаю, что нашел решение. Похоже, на локальном сервере (из Visual Studio) параметр по умолчанию BundleTable.EnableOptimizations имеет значение false. Но когда вы публикуете на IIS на serwer, это правда. Попробуйте добавить BundleTable.EnableOptimizations = false в BundleConfig.cs

У вас ScriptBundle удалите angular.min, angular-local-storage.min и добавьте их неунифицированные версии

Чтобы включить минификацию, убедитесь в следующем:

  • Config.asax, зарегистрируйте BundlesConfig

    защищенная пустота Application_Start ()
    {
        BundlesConfig.RegisterBundles (BundleTable.Bundles);
    }
  • BundleConfig.cs, включите сценарии и включите оптимизацию

    public static void RegisterBundles(BundleCollection bundles)
    {
      bundles.Add(new ScriptBundle("~/bundles/jquery"). Включить ("~ / Сценарии /jquery-{версия}.js"));
    
      BundleTable.EnableOptimizations = true;
    }
  • main.html, зарегистрируйте скрипты

    @section scripts {
      @Scripts.Render("~/ связки / JQuery")
    }
  • Кроме того, процесс минимизации изменяет $scope и $q на случайные величины. Поскольку это не говорит angular, что вводить, решение состоит в том, чтобы объявить ваши зависимости, завернутые в []:

    angular.module ("MyApp").controller ("MyCtrl", ["$scope", "$q", функция ($scope, $q) {
      // ваш код
    }])

Это всего лишь шаги, необходимые для включения минификации. Это статья о том, как актуально для этого

Другие вопросы по тегам