按要求优化Require.js后不加载车把

Question

我的应用程序使用了约曼主干网生成器。我想用把手做模板。当我包含一个垫片时，它在grunt serve的开发中发挥了很大的作用。

// main.js

require.config({
  shim: {
    bootstrap: {
      deps: ['jquery'],
      exports: 'jquery'
    },
    handlebars: {
      exports: 'Handlebars'
    }
  },
  paths: {
    jquery: '../bower_components/jquery/dist/jquery',
    backbone: '../bower_components/backbone/backbone',
    underscore: '../bower_components/underscore/underscore',
    bootstrap: '../bower_components/sass-bootstrap/dist/js/bootstrap',
    handlebars: '../bower_components/handlebars/handlebars'
  }
});

但是，当我试图用grunt build构建项目时，我会收到一个错误，当我加载页面时，工具栏是未定义的(无法在未定义的页面上调用registerPartial )。当我排除车把的垫片时，这也是开发中的相同行为。

这是Gruntfile中的requirejs任务的样子：

// from Gruntfile.js

requirejs: {
    dist: {
        options: {
            baseUrl: '.tmp/scripts',
            optimize: 'none',
            paths: {
                'templates':  '../../.tmp/scripts/templates',
                'jquery':     '../../<%= yeoman.app %>/bower_components/jquery/dist/jquery',
                'underscore': '../../<%= yeoman.app %>/bower_components/underscore/underscore',
                'backbone':   '../../<%= yeoman.app %>/bower_components/backbone/backbone',
                'bootstrap':  '../../<%= yeoman.app %>/bower_components/sass-bootstrap/dist/js/bootstrap',
                'handlebars': '../../<%= yeoman.app %>/bower_components/handlebars/handlebars'
            },
            shim: {
                handlebars: {
                    exports: 'Handlebars'
                }
            },
            preserveLicenseComments: false,
            useStrict: true,
            wrap: true
        }
    }
},

此项目被配置为对Grunt任务使用grunt-requirejs。当任务使用Grunt运行时，这是requirejs任务的输出，因此我知道Gruntfile和main.js中都定义了shim。

// Grunt console output for requirejs task

requirejs:
{ dist:
 { options:
    { baseUrl: '.tmp/scripts',
      optimize: 'none',
      paths:
       { templates: '../../.tmp/scripts/templates',
         jquery: '../../app/bower_components/jquery/dist/jquery',
         underscore: '../../app/bower_components/underscore/underscore',
         backbone: '../../app/bower_components/backbone/backbone',
         bootstrap: '../../app/bower_components/sass-bootstrap/dist/js/bootstrap',
         handlebars: '../../app/bower_components/handlebars/handlebars' },
      shim: { handlebars: { exports: 'Handlebars' } },
      preserveLicenseComments: false,
      useStrict: true,
      wrap: true,
      name: 'main',
      out: 'dist\\scripts\\main.js',
      mainConfigFile: '.tmp\\scripts\\main.js' } } }

还有什么东西我可能遗漏了吗？

Answer 1

显然，我只需要在Gruntfile中的构建配置中将wrapShim设置为true。

requirejs: {
    dist: {
        options: {
            baseUrl: '.tmp/scripts',
            optimize: 'none',
            paths: {
                'templates':  '../../.tmp/scripts/templates',
                'jquery':     '../../<%= yeoman.app %>/bower_components/jquery/dist/jquery',
                'underscore': '../../<%= yeoman.app %>/bower_components/underscore/underscore',
                'backbone':   '../../<%= yeoman.app %>/bower_components/backbone/backbone',
                'bootstrap':  '../../<%= yeoman.app %>/bower_components/sass-bootstrap/dist/js/bootstrap',
                'handlebars': '../../<%= yeoman.app %>/bower_components/handlebars/handlebars'
            },
            preserveLicenseComments: false,
            useStrict: true,
            wrap: true,
            wrapShim: true
        }
    }
},

实际上，它从main.js获得了shim配置，所以一切都很棒。希望这能帮助人们应对同样的挫折。