在 RequireJS 中使用 Backbone 中的 NPM 模块

Question

赫萨， 我正在编写一个 webapp，它由一个 Node 后端（Express 服务器）组成，它为客户端提供一个 Backbone 应用程序。 Backbone 应用程序使用 RequireJS 来加载使用的模块。 我想使用 Ag-grid 客户端，它可以作为 NPM 模块包含在内。 https://www.ag-grid.com/javascript-grid-getting-started/index.php

如何从 Backbone 引用这个 NPM 模块？

项目结构

./node_modules ./src/package.json ./src/app (Node backend + Express server) ./src/public ./src/public/main.coffee (contains requireJs config) ./src/public/scripts (Backbone views, models, etc)

ma​​in.coffee

require.config
    baseUrl: '../scripts/'
    paths:
        jquery: '//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min'
        jqueryui: '//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min'
        underscore: '//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min'
        ...

我想在此处包含 ag-grid NPM 模块，但不必将最顶部的 ./node_modules 文件夹引用为 ../../../node_modules/ag-grid/dist/ag-grid（没有计算级别..）。 另外，如果可能的话，我想避免第二个 package.js 和第二个 npm install

任何与此项目结构特别相关的帮助？ 其次，有没有更好的方法来构建这样一个项目？ （服务于 Backbone webapp 的节点后端）

谢谢

Answer 1

您猜对了，使用相对路径一直到 node_modules 目录是可行的方法。

requirejs.config({
    paths: {
        "ag-grid": "../../../node_modules/ag-grid/dist/ag-grid",
        "backbone": "../../../node_modules/backbone/backbone"
    }
});

define(["backbone", "ag-grid"], function(Backbone, agGrid) {
    // whatever
});

您还可以将npm 用于所有依赖项，并使用RequireJS optimizer (r.js) 捆绑您的应用的优化版本。

就我个人而言，我使用npm 进行项目开发和服务器端（节点）依赖项。对于我的 Backbone 应用程序，我使用 Bower，因为它专门用于前端依赖项管理。

我有一个 .bowerrc 文件，告诉 bower 在哪里安装依赖项：

{
    "directory": "src/lib",
}

还有一个调用 bower install 的 Gulp 任务：

var bower = require("bower"),
    $ = require('gulp-load-plugins')({ lazy: true }),
    gulp = require("gulp");

gulp.task('bower', function() {
    return bower.commands.install()
        .on('log', function(data) {
            $.util.log('bower', $.util.colors.cyan(data.id), data.message);
        });
});

此任务在npm install 之后使用 npm 钩子自动调用：

"scripts": {
  // ...
  "postinstall": "gulp install"
}

查看simplified-js-project，这是一个示例项目，它展示了我围绕 Backbone 和 RequireJs 项目的开发工具。