适用于多应用项目的 Grunt 和 requirejs 优化器

我在让 Grunt 对具有以下结构的项目执行 requirejs 优化时遇到问题：

static/js
    |── apps
        |── app.js
        |── dash.js
        |── news.js
        ... (many more 'app' files)
    |── build
    |── collections
    |── libs
    |── models
    |── util
    |── views

Each of static/js/apps/*.js应该编译为static/js/build/*.js包含相关的依赖项（例如views/view1, libs/query etc).

目前这是由一个基本的 bash 脚本执行的：

JS_ROOT="static/js"

for f in ${JS_ROOT}/apps/*
do
    FILE=$(basename -s .js ${f})
    pushd .
    cd ${JS_ROOT} && r.js -o baseUrl=. name=libs/require-min.js include=apps/${FILE} out=build/${FILE}.js
    popd
done

我正在尝试转向基于 Grunt 的优化，其中包含以下内容Grunt.js:

requirejs: {
    compile: {
        options: {
            appDir: 'static/js/',
            baseUrl: './apps/',
            dir: 'static/js/build/',
            modules: [
                {
                    name: 'app',
                }
            ]
        }
    }
}

运行会产生以下错误：

>> Tracing dependencies for: app
>> Error: ENOENT, no such file or directory
>> 'static/js/build/apps/libs/jquery.js'
>> In module tree:
>>     app

我可以清楚地看到问题是什么，但无法弄清楚如何指示每个中的依赖关系static/js/apps/*.js文件在static/js/ not static/js/build

除此之外，我假设modules块包含name: 'app'应该输出编译后的文件static/js/build/app.js从内容static/js/apps/app.js.

无需创建额外的module每个文件的块static/js/apps，我怎样才能将每个文件编译成它们相关的static/js/build/*.js file?

Update 1

所以我的 Gruntfile 中的以下内容编译static/js/apps/app.js成功进入static/js/build/app.js:

requirejs: {
    compile: {
        options: {
            baseUrl: 'static/js/',
            include: './apps/app.js',
            out: 'static/js/build/app.js',
        }
    }
}

下一步是编译static/js/apps/*.js into static/js/build/*.js无需单独定义每个...

Update 2

将上面修改为：

requirejs: {
    compile: {
        options: {
            baseUrl: '../',
            include: './apps/<%= appFile %>',
            out: 'static/js/build/<%= appFile %>',
        }
    }
}

并创建任务：

grunt.registerTask('buildrjs', function() {
    var dir='static/js/apps/';
    grunt.file.setBase(dir);
    var files = grunt.file.expand(['*.js']);
    files.forEach(function(filename) {
        grunt.log.write('Compiling '+filename+'\n');
        grunt.config.set('appFile', filename);
        grunt.task.run('requirejs:compile');
    });
});

几乎让我找到了解决方案。任务运行在每个文件中static/js/apps/并将文件名传递到grunt.config.set('appFile', filename);。任务输出的输出Compiling app.js Compiling news.js...等等，但是之后实际的requirejs:compile任务在最后一个文件上反复运行static/js/apps/目录，而不是每个单独的文件。异步问题？

解决了，通过将多组选项传递给 requirejs 任务，感谢本文 http://clintconklin.com/optimizing-multiple-javascript-files-with-grunt-and-requirejs/对于我需要的最终指示：

module.exports = function(grunt) {
    var files = grunt.file.expand('static/js/apps/*.js');
    var requirejsOptions = {};

    files.forEach(function(file) {
        var filename = file.split('/').pop();
        requirejsOptions[filename] = {
            options: {
                baseUrl: 'static/js/',
                include: './apps/'+filename,
                out: 'static/js/build/'+filename
            }
        };
    });

    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        requirejs: requirejsOptions,
    });
};

然后['requirejs']任务可以正常运行，并将根据每个任务输出适当的编译后的 .js 文件options: {}中指定的块requirejsOptions, eg:

grunt.registerTask('default', ['requirejs']);