Question

我正在尝试使用angularjs，ui-router和requirejs来延迟加载我的控制器。它在本地运行良好，但我想为生产环境编写requirejs优化器，尝试使用grunt：requirejs工具，但它对我没有用。它甚至不会给任何脚本加载错误或什么..

SELECT ID, MIN(dt)
FROM
 (
   SELECT *
   FROM tab
   QUALIFY
      -- returns NULL until the first row with a value in Field_Of_Interest
      MIN(Field_Of_Interest) 
      OVER (PARTITION BY ID
            ORDER BY dt DESC
            ROWS UNBOUNDED PRECEDING) IS NULL
 ) AS dt
GROUP BY 1

我正在使用grunt：requirejs任务来编译优化的dist文件＆＃34; main.js＆＃34;和dist目录中修改后的index.html的grunt副本：

grunt：requirejs和modified index.html - ＆gt;

<--index.html--!>
<!DOCTYPE html>
<html style="overflow-x:hidden">
  <head>
  </head>

  <body class="no-padding">
    <div data-ui-view="header"></div>
    <div data-ui-view="module"></div>
    <script data-main="app/main" src="bower_components/requirejs/require.js"></script>
  </body>

</html>


//main.js
require.config({
    baseUrl: "",
    // Paths for just the core application and its controllers/factories/services
    paths: {
            "jquery": "bower_components/jquery/dist/jquery",
        "angular":                    "bower_components/angular/angular.min",
        "angular-ui-router":          "bower_components/angular-ui-router/release/angular-ui-router.min",
          "app":                        "app/app",
        "underscore":                 "node_modules/underscore/underscore-min",
    },


  shim: {
        //Tell requirejs to pipe in angular"s return variable as "angular"
    "angular": {
      exports: "angular"
    },
  },
    // Say we have a dep on App, so it gets loaded
  deps: ["app", 'lib']
});

//lib.js
define([
  'jquery',
  'underscore',
], function($){
});


//app.js
define([
  'angular',
  'angular-ui-router'
], function(){
  var app = angular.module('app', ['ui.router']);


  //lazy loading
  var loadController = function(path){
    return ['$q', function($q){
      var defered = $q.defer();
      require([path], function(){
        defered.resolve();
      });
      return defered.promise;
    }]
  };


  app.config(['$controllerProvider',  function($controllerProvider){
    app.registerController = $controllerProvider.register;
  }]);


  app.config(['$stateProvider',  function($stateProvider){
    //registering controller
    // defining states
    $stateProvider.state('app', {
      url: '/',
      views: {
        'header':{
          templateUrl:"<div>{{title}}</div>",
          controller:"appCtrl"
        },
        'module':{
          template:"<div>{{title}}</div>",
          controller:"homeCtrl"
        }
      },
      resolve: {
         loadApp: loadController('../app/controllers/header'),
         loadHome: loadController('../app/controllers/home')
      }
    });
  }]);
  angular.bootstrap(document, ['app']);
  return app;
});

//home.js

define(function(){
  angular.module('app').registerController('homeCtrl', ['$scope', '$state', function($scope,$state){
    $scope.title = 'CONTENT';
  }]);
});

//header.js
define(function(){
   angular.module('app').registerController('appCtrl', ['$scope', '$state', function($scope,$state){
     $scope.title = 'HEADER';
   }]);
});

当加载dist / index.html它没有给我任何东西，浏览器没有错误，只是不起作用，如果它给了我控制器的脚本加载错误它可能有任何意义，但它没有。完全无能为力..

Answer 1

main.js文件中没有任何内容。您必须至少要求路径中声明的一个文件。这样做：

require(['app'], function () {
    console.log('app required successfully');
});

将这行代码放在main.js文件中。我希望找到错误可能会有所帮助：

requirejs.onError = function (err) {
    console.error('[require error] type: ', err.requireType, ' ,modules: ' + err.requireModules);
    throw err;
};

需要使用angularjs优化器

1 个答案: