ui-router与oc-lazyload与webpack

新的angular框架使用了路由机制和懒加载机制，未使用webpack打包项目，考虑到项目加载性能和安全，使用webpack对其进行打包，却遇到了问题。

最初在路由配置里的 resolve属性里写如下代码，总是报错说找不到 dataSearchController ，dataSearchController不是一个函数

    $stateProvider.state('entry.dataSearch', {
        url: '/dataSearch',
        // resolve: {
        //     loadDeps: ['$q', '$ocLazyLoad', ($q, $ocLazyLoad) => {
        //             return $q((resolve) => {
        //                 require.ensure([], () => {
        //                     var a = require('widgets/dataSearch/controllers/dataSearchController');
        //                     var a2 = require('directives/check/checkBootstrap');
        //                     var a3 = require('directives/projSearch/projSearchBootstrap');
        //                     $ocLazyLoad.inject([a, a2, a3])
        //                     resolve([a, a2, a3]);
        //                 }, 'dataSearch');
        //             });
        //         }]
        //     }]
        // },
        // 以上方式是ES6的写法
        resolve: {
            loadDeps: ['$q', '$ocLazyLoad', function ($q, $ocLazyLoad) {
                var deferred = $q.defer();
                require.ensure([], function () {
                    var a = require('widgets/dataSearch/controllers/dataSearchController');                  
                    var a2 = require('directives/check/checkBootstrap');
                    var a3 = require('directives/projSearch/projSearchBootstrap');
                    deferred.resolve([a, a2, a3]);
                    $ocLazyLoad.inject([a, a2, a3])
                }, 'dataSearch');
                return deferred.promise;
            }]
        },
        views: {
            "content": {
                templateUrl: 'scripts/widgets/dataSearch/templates/dataSearch.html',
                controller: 'dataSearchController'
            }
        }
    });

后来在github上找到一段代码，在resolve里添加后终于可以正常运行了，虽然不影响运行，但还是会报错，代码如下

    $stateProvider.state('entry.dataSearch', {
        url: '/dataSearch',
        // 以上方式是ES6的写法
        resolve: {
            loadDeps: ['$q', '$ocLazyLoad', function ($q, $ocLazyLoad) {
                var deferred = $q.defer();
                require.ensure([], function () {
                    var a = require('widgets/dataSearch/controllers/dataSearchController');          
                    $ocLazyLoad.load({
                           name: 'dataSearchController'
                     });        
                    var a2 = require('directives/check/checkBootstrap');
                    var a3 = require('directives/projSearch/projSearchBootstrap');
                    deferred.resolve([a, a2, a3]);
                    $ocLazyLoad.inject([a, a2, a3])
                }, 'dataSearch');
                return deferred.promise;
            }]
        },
        views: {
            "content": {
                templateUrl: 'scripts/widgets/dataSearch/templates/dataSearch.html',
                controller: 'dataSearchController'
            }
        }
    });

再后来，在网上找到一段代码，对全局app做配置后就好了

    app.config(['$controllerProvider', '$compileProvider', '$filterProvider', '$provide', function ($controllerProvider, $compileProvider, $filterProvider, $provide) {
        // lazy controller, directive and service 
        app.controller = $controllerProvider.register;
        app.directive = $compileProvider.directive;
        app.filter = $filterProvider.register;
        app.factory = $provide.factory;
        app.service = $provide.service;
        app.constant = $provide.constant;
        app.value = $provide.value;
    }]);

问题分析

初步感觉，与ui-router和oc-lazyoad的某些机制有关

参考文章
https://github.com/ay13/webpack-angular-oclazyload
https://github.com/voidberg/webpack-angularjs-lazyload
http://www.oschina.net/question/2398274_2148307
https://github.com/ocombe/ocLazyLoad/issues/100