yeoman:使用yo网络应用，然后在混合中添加主干和backbone.layoutmanager

Question

我成功地安装了一个使用yeoman webapp生成器插件的webapp。

我想增加骨干和backbone.layoutmanager的组合。

但是，当我试图运行https://github.com/isaacs/npm/issues/3275时，会遇到诸如npm install && bower install之类的错误。

这是我现在的main.js

require.config({
    paths: {
        jquery: '../components/jquery/jquery',
        backbone: '../../node_modules/backbone/backbone',
        underscore: "../components/underscore/underscore",
        layoutmanager: "../../node_modules/backbone.layoutmanager/backbone.layoutmanager",
        bootstrap: 'vendor/bootstrap'
    },
    shim: {
        bootstrap: {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },
        layoutmanager: {
            deps: ["backbone"],
            exports: "Backbone.Layout"
        }
    },

});

require(['app', 'jquery', 'bootstrap'], function (app, $) {
    'use strict';
    // use app here
    console.log(app);
    console.log('Running jQuery %s', $().jquery);
});

我现在的component.json

{
  "name": "learnbackbonelayoutmanager",
  "version": "0.0.0",
  "dependencies": {
    "sass-bootstrap": "~2.3.0",
    "requirejs": "~2.1.4",
    "modernizr": "~2.6.2",
    "jquery": "~1.9.1"
  },
  "devDependencies": {}
}

我现在的package.json

{
  "name": "learnbackbonelayoutmanager",
  "version": "0.0.0",
  "dependencies": {},
  "devDependencies": {
    "grunt": "~0.4.0",
    "grunt-contrib-copy": "~0.4.0",
    "grunt-contrib-concat": "~0.1.2",
    "grunt-contrib-coffee": "~0.4.0",
    "grunt-contrib-uglify": "~0.1.1",
    "grunt-contrib-compass": "~0.1.2",
    "grunt-contrib-jshint": "~0.1.1",
    "grunt-contrib-cssmin": "~0.4.1",
    "grunt-contrib-connect": "0.1.2",
    "grunt-contrib-clean": "0.4.0",
    "grunt-contrib-htmlmin": "0.1.1",
    "grunt-contrib-imagemin": "0.1.2",
    "grunt-contrib-livereload": "0.1.1",
    "grunt-bower-hooks": "~0.2.0",
    "grunt-usemin": "~0.1.9",
    "grunt-regarde": "~0.1.1",
    "grunt-requirejs": "~0.3.2",
    "grunt-mocha": "~0.2.2",
    "grunt-open": "~0.2.0",
    "matchdep": "~0.1.1"
  },
  "engines": {
    "node": ">=0.8.0"
  }
}

yo webapp 如何设置定义的webapp默认设置，并将主干和Backbone.LayoutManager添加到其中？

Answer 1

您似乎已经通过npm安装了主干和布局管理器。如果要将这些组件用作前端组件，则应通过bower安装它们。

bower install --save backbone layoutmanager

之后，按照以下方式调整main.js中的路径：

require.config({
    paths: {
        jquery: '../components/jquery/jquery',
        backbone: '../../components/backbone/backbone',
        underscore: '../components/underscore/underscore',
        layoutmanager: '../components/backbone.layoutmanager/backbone.layoutmanager',
        bootstrap: 'vendor/bootstrap'
    },
    shim: {
        bootstrap: {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },
        layoutmanager: {
            deps: ['backbone'],
            exports: 'Backbone.Layout'
        }
    },

});

require(['app', 'jquery', 'bootstrap'], function (app, $) {
    'use strict';
    // use app here
    console.log(app);
    console.log('Running jQuery %s', $().jquery);
});