1

在Addy Osmani (O'Reilly) 关于Grunt-BBB (Backbone Boilerplate Buddy)的“开发 Backbone.js 应用程序”一章之后,我无法创建构建配置文件。

这是用于此的文件系统树:

/builds
    /closure
    /rhino
    /config
        /build.js
    build.sh
/development
    /* Grunt-BBB files after init */
    /app
        /styles
            index.css
        app.js
        config.js
        main.js
        router.js
    /test
        /* Not important files used for testing */
    /vendor
        /h5bp
            /css
                main.css
                normalize.css
        /jam
            /backbone
                backbone.js
                package.json
            /bakbone.layoutmanager
                bakbone.layoutmanager.js
                package.json
            /jquery
                jquery.js
                package.json
            /lodash
                lodash.js
                lodash.min.js
                lodash.underscore.min.js
                package.json
            require.config.js
            require.js
        /js
            /libs
                almond.js
                require.js
/distribution
    /* Empty dist directory where the optimized / minified / concatenated files should go */

/development这是我在目录中遵循的步骤:

1) 安装 Grunt-BBB ( npm install -g bbb)

2) 下载 r.js,Require.js 项目的一部分 ( git clone https://github.com/backbone-boilerplate/grunt-bbb)

3) 初始化样板文件( bbb init)

这是我用来为 Google Closure 编译器配置 r.js AMD 加载器的 build.js 文件:

({
    appDir: '../../development',
    baseUrl: 'app',
    dir: '../../distribution',
    optimize: 'closure', // 'uglify2'
    paths: {
        backbone: '../vendor/jam/backbone/backbone',
        'backbone.layoutmanager': '../vendor/jam/backbone.layoutmanager/backbone.layoutmanager',
        jquery: '../vendor/jam/jquery/jquery',
        lodash: '../vendor/jam/lodash/backbone.min'
    },
    modules: [
        {
            name: 'main'
        }
    ],
    onBuildRead: function(moduleNames, path, contents) {
        return contents;
        //return contents.replace(/console\.log\(([^\)]+)\);/g, '')
        //              .replace(/debugger;/, '');
    }
})

这是我使用的 build.sh 文件:

#!/usr/bin/env bash

# r.js directory
RJSDIR="r.js"
RJS="$RJSDIR/dist/r.js"

# Rhino directory
RHINODIR="rhino"
RHINO="$RHINODIR/js.jar"

# Google Closure Compiler directory
CLOSUREDIR="closure"
CLOSURE="$CLOSUREDIR/compiler.jar"

# Build config directory
CONFIGDIR="config"
CONFIG="$CONFIGDIR/build.js"

# Launch compillation
java -Xms256m -Xmx256m -classpath "$RHINO":"$CLOSURE" org.mozilla.javascript.tools.shell.Main "$RJS" -o "$CONFIG" $@

我的目标是优化、缩小、连接所有 JavaScrit 文件,包括库和模板(我还没有,我只使用样板文件)以及 CSS 文件。

我通过运行得到的结果./build.sh是每个文件都被正确最小化(除了 CSS 规则内联,但这不是重点)并连接,但由 Jam(结合 NPM 和 Require.js 的包管理器)加载和管理的资源是'没有串联。

原因是它们已经被 Jam 加载/管理,它们不会在 JavaScript 文件 AMD 样式中重新声明。

总之,我的问题如下:

  • 如何重写我的build.js配置文件,以便 Jam 加载的资源也包含并连接到 release/dist 文件中?

  • 我怎样才能使连接的资源不会复制到 realse / dist 目录中?是否可以在build.js文件中配置它或者应该在我的build.sh文件中配置它?

编辑:新的 build.js 文件:

({
    appDir: '../../development',
    baseUrl: 'app',
    dir: '../../distribution',
    optimize: 'closure', // 'uglify2'
    paths: {
        requirejs : '../vendor/jam/require',
        backbone: '../vendor/jam/backbone/backbone',
        'backbone.layoutmanager': '../vendor/jam/backbone.layoutmanager/backbone.layoutmanager',
        jquery: '../vendor/jam/jquery/jquery',
        lodash: '../vendor/jam/lodash/backbone.min'
    },
    name: 'main',
    include: ['requirejs'],
    onBuildRead: function(moduleNames, path, contents) {
        return contents;
        //return contents.replace(/console\.log\(([^\)]+)\);/g, '')
        //              .replace(/debugger;/, '');
    }
})

这是错误:

file:///vendor/js/libs/require.jsFailed to load resource: The requested URL was not found on this server.
file:///app/styles/index.cssFailed to load resource: The requested URL was not found on this server.
4

1 回答 1

0

require.js 永远不会包含在 r.js 中,除非您指示它这样做。请参阅此链接:

http://requirejs.org/docs/optimization.html#onejs

该链接指的是命令行选项,但构建文件选项大致相同:

您需要在路径中为 require.js 定义一个虚拟模块:

paths: {
    requireLib : '/path/to/require.js'
    backbone: '../vendor/jam/backbone/backbone',
    'backbone.layoutmanager': '../vendor/jam/backbone.layoutmanager/backbone.layoutmanager',
    jquery: '../vendor/jam/jquery/jquery',
    lodash: '../vendor/jam/lodash/backbone.min'
},

并包括它:

name "main",    
include: ["requireLib"],

您可以通过设置来确保解决所有嵌套的依赖项:

findNestedDependencies: true,

您可以在构建文件中使用“out”配置输出路径

out: "path/to/my/builtfile-1.0.0.js",

抱歉,我对 jam 了解得不够多,无法说明 jam 是否会覆盖此设置

_佩斯

于 2013-07-26T20:23:33.337 回答