在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.