使用 requirejs 并尝试将 javascript 优化为 vendor 文件和 app 文件

Question

我正在使用 requirejs 开发一个项目，我正在尝试将我的 javascript 优化为两个文件：供应商库和应用程序代码。不幸的是，我似乎无法让它工作。

文件夹结构：

• backbone_components/
• 应用/
  • 少/
  • js/
    • 组件1/
    • 组件2/
    • 布局/
      • 仪表板/
      • 关于/
    • lib/
    • config.js
    • main.js
  • index.html
• 分布/
• Gruntfile.js

config.js：

require.config({
  baseUrl: '../js/',
  paths: {
    jquery:     '../../bower_components/jquery/dist/jquery',
    underscore: '../../bower_components/lodash/dist/lodash',
    backbone:   '../../bower_components/backbone/backbone',
    text:       '../../bower_components/requirejs-text/text'
  },
  enforeceDefine: true
});

define(['backbone', 'main'], function(Backbone, app) {
});

Gruntfile.js：

requirejs: {
  options: {
    dir: 'dist/js/',
    mainConfigFile: 'app/js/config.js',
    optimize: 'none', 
    normalizeDirDefines: 'all',
    skipDirOptimize: true
  },
  dist: {
    options: {
      modules: [
        {
          name: 'vendor',
          include: ['jquery', 'underscore', 'backbone', 'text'],
        },
        {
          name: 'app',
          exclude: ['vendor']
        }
      ]
    }
  }
});

---

当我运行grunt 时，我收到以下错误：“错误：错误：错误：模块路径不存在：/path/to/project/app/js/app/js/vendor.js for module named : 供应商。”

为什么在“供应商”还不存在的情况下寻找它？

Answer 1

我认为您要优化的源代码中没有名为 vendor 的模块。如果这是正确的，那么您得到的错误是因为r.js 正在 寻找名为vendor 的模块。您必须使用 create 选项告诉它创建它：

modules: [
    {
      name: 'vendor',
      create: true,            // <--- Add this option!
      include: ['jquery', 'underscore', 'backbone', 'text']
    },
    {
      name: 'app',
      exclude: ['vendor']
    }
]

如果没有选项 r.js，您可以理解为“采用 vendor 模块并包含 jquery 等”。使用该选项，您是在告诉它从头开始创建 vendor。

create 选项记录在 in this file。