Question

我有一个可能有很多模块的Angular项目。每个模块都有自己的目录，包含控制器，指令，服务等的子目录。像这样：

src
|-- js
    |-- modules
        |-- moduleOne
            | module.js
            |-- controllers
                | listController.js
                | detailController.js
            |-- directives
                | listItem.js
                | summaryWidget.js
            |-- filters
            |-- services
                | moduleService.js

我的构建基本上捆绑并编译来自src /的文件并放入dev /，然后缩小dev /中的文件并移动到prod /。在开发期间，服务器指向dev /文件夹，在生产中，服务器指向prod /文件夹（也就是为什么文件以.min.js结尾，即使它们只是编译/连接）。这个过程运作良好。

目前，我的concat任务是抓取moduleOne /中的所有文件，并在我的dev目录中创建一个moduleOne.js文件。这就是我想要的，但更动态：

concat: {
    modules: {
        files: {
            "dev/js/modules/moduleOne.min.js": [
                "src/js/modules/moduleOne/*.js",
                "src/js/modules/moduleOne/**/*.js"
            ],
            "dev/js/modules/moduleTwo.min.js": [
                "src/js/modules/moduleTwo/*.js",
                "src/js/modules/moduleTwo/**/*.js"
            ]
        } 
    }
}

问题是我必须为每个模块执行此操作，但不要认为我需要。

我尝试了以下操作，因为这是我想做的事情：

concat: {
    modules: {
        files: [{
            expand: true,
            cwd: "src/js/modules",
            src: "**/*.js",
            dest: "dev/js/modules",
            ext: ".min.js"
        }]
    }
}

但结果是我的所有文件和目录结构都从src /移到了dev /。我基本上用concat做副本，没用。

我想做这样的事情：

concat: {
    modules: {
        files: [{
            expand: true,
            cwd: "src/js/modules",
            src: "**/*.js",
            dest: "dev/js/modules/<foldername>.min.js",  <- how do I achieve this?
        }]
    }
}

我一直在阅读很多内容，但似乎我只能找到答案并且无法将概念放在一起。我找到的很多东西只是将一个文件放入一个新目录，并重命名。我想将多个文件单个文件重命名为新目录。因为我是如何滚动的。）

Answer 1

所以，我找到了我想要的答案。

This SO post基本上是一个答案很好的问题。不幸的是，当我创建我的问题时它没有出现，否则你就不会读这个了。

我的需求略有调整。我需要动态地为每个模块而不是只有一个compile.js文件做这个，所以我的最终代码如下，放在我的initConfig（）之后：

grunt.registerTask("prepareModules", "Finds and prepares modules for concatenation.", function() {

    // get all module directories
    grunt.file.expand("src/js/modules/*").forEach(function (dir) {

        // get the module name from the directory name
        var dirName = dir.substr(dir.lastIndexOf('/')+1);

        // get the current concat object from initConfig
        var concat = grunt.config.get('concat') || {};

        // create a subtask for each module, find all src files
        // and combine into a single js file per module
        concat[dirName] = {
            src: [dir + '/**/*.js'],
            dest: 'dev/js/modules/' + dirName + '.min.js'
        };

        // add module subtasks to the concat task in initConfig
        grunt.config.set('concat', concat);
    });
});

// the default task
grunt.registerTask("default", ["sass", "ngtemplates", "prepareModules", "concat", "uglify", "cssmin"]);

这实质上使得我的concat任务看起来就像我手工编写时那样，但只是更简单（可扩展！）。

concat: {
    ...
    moduleOne: {
        src: "src/js/modules/moduleOne/**/*.js",            
        dest: "dev/js/modules/moduleOne.min.js"
    },
    moduleTwo:{
        src: "src/js/modules/moduleTwo/**/*.js",
        dest: "dev/js/modules/moduleTwo.min.js"
    }
}

我从SO帖子中得到的另一个偏差是我选择不让prepareModules在完成时自行运行concat。我的默认任务（哪个手表设置为在开发期间运行）仍然完成所有处理。

这给我留下了以下结构，准备缩小为prod /：

| dev
    | js
        | modules
            |-- moduleOne.min.js
            |-- moduleTwo.min.js

使用grunt将许多目录中的许多文件连接到新目录中的单个重命名文件中

1 个答案: