javascript - Grunt 添加多个输入/输出目录

Question

我正在使用 grunt-babel 将我的 react-jsx 文件转换为 .js。

我计划为此编写一个繁琐的任务。目前，我有以下内容

module.exports = function( grunt ) {
    require('load-grunt-tasks')(grunt);
    grunt.initConfig( {

        babel : {
            options : {
                plugins : ['transform-react-jsx'],
                presets: ['es2015', 'react']
            },
            client : {
                expand : true,
                cwd : './react_demo/test/jsx/common',
                src : ['*.jsx'],
                dest : './react_demo/static/react/components',
                ext : '.js'
            }
        }
    } );

    grunt.loadNpmTasks('grunt-babel');
    grunt.registerTask('default', ['babel:client']);

};

在上述任务中，我想做的是，将文件夹 ./react_demo/test/jsx/common 中存在的所有 JSX 文件转换为 ./react_demo/static/react/components.

现在，在我将来的应用程序中，我们可以有多个文件夹，每个文件夹都有自己的一组 JSX 文件，这些文件将进入不同的目标文件夹。

我们可以有这样的文件夹:

• /react_demo/test/jsx/common ->/react_demo/static/react/components
• /react/test/jsx/common1 ->/react/static/react/components1
• /react2/test/jsx/common2 ->/react2/static/react/components2

现在，我如何指定多个 src/dest 目录并将它们映射在一起？我尝试向 src/dest 提供一个数组，但它提示以下错误:

Warning: Path must be a string. Received [ './react_demo/cartridge/scripts/jsx/common' ] Use --force to continue.

Answer 1

据我所知，您必须为每个新目的地指定一个新的 babel 目标:

module.exports = function( grunt ) {
    require('load-grunt-tasks')(grunt);
    grunt.initConfig( {

        babel : {
            options : {
                plugins : ['transform-react-jsx'],
                presets: ['es2015', 'react']
            },
            client : {
                expand : true,
                cwd : './react_demo/test/jsx/common',
                src : ['*.jsx'],
                dest : './react_demo/static/react/components',
                ext : '.js'
            },
            common1 : {//add more targets
                expand : true,
                cwd : './react/test/jsx/common1',
                src : ['*.jsx'],
                dest : './react/static/react/components1',
                ext : '.js'
            }//etc..

        }
    } );

    grunt.loadNpmTasks('grunt-babel');
    grunt.registerTask('default', ['babel:client','babel:common1']);//reg new targets

};