Question

我有一个巨大的样式表代码库，在我要编译为.css文件的多个文件夹和子文件夹中包含许多.scss文件。到目前为止一切都很好。

但无论出于何种原因，我需要将.css文件编译到与每个源文件夹中的.scss文件不同的目标文件夹中。

我拥有的源路径：

src/project-1/scss/project-1.scss
src/project-2/subfolder/scss/project-2.scss

我需要的目标路径：

src/project-1/css/project-1.css
src/project-2/subfolder/css/project-2.css

我的咕噜声任务设置如下：

sass: {
    prod: {
        options: {
            style: 'expanded'
        },
        files: [{
            expand: true,
            cwd: 'src',
            src: ['**/*.scss'],
            dest: 'src',
            ext: '.css',
        }]
    }
}

此设置将每个.css文件编译为与.scss文件相同的文件夹。我需要他们从＆＃34; scss＆＃34;文件夹并进入＆＃34; css＆＃34;同一父文件夹中的文件夹。

正在寻找解决方案：

我在dest字段中尝试了不同的值而没有任何运气。

我尝试使用grunt-contrib-copy和rename()函数：

copy: {
    target: {
        files: [{
            expand: true,
            cwd: 'src',
            src: ['**/*.css'],
            dest: 'src/',
            rename: function(dest, src) {
                return dest + src.replace(/\/scss\/$/, "/css/");
            }
        }]
    }
}

后者＆＃34;几乎＆＃34;作品。我正在将文件复制到他们自己的目的地，同时尝试重命名＆＃34; scss＆＃34;文件夹到＆＃34; css＆＃34;，但是替换功能似乎并不能确定源路径中的文件夹名称，只有文件名。

我是接近解决方法还是我走向死胡同？

编辑：找到解决方案

我对rename函数做了一些小改动，解决了我的问题：

sass: {
    prod: {
        options: {
            style: 'expanded'
        },
        files: [{
            expand: true,
            cwd: "src",
            src: ["**/*.scss"],
            dest: "src/",
            ext: ".css",
            rename: function (dest, src) {
                return dest + src.replace('scss', 'css'); // The target file is written to folder "css" instead of "scss" by renaming the folder
            }
        }]
    }
}

这是在一个与Source / scss文件夹相同级别的新/ css文件夹中给我编译的CSS。

例如：

src/project-1/scss/project-1.scss已编译为src/project-1/css/project-1.css。

我也对files: [{...}]和grunt-autoprefixer任务使用完全相同的grunt-contrib-cssmin设置，并且它们都写入同一个文件夹和文件。

使用grunt-contrib-sass编译到相对于其源的多个目标（递归）

0 个答案: