在Gulp中基于regex重命名文件 [英] Rename file based on regex in Gulp

问题描述

假设我有一个像这样的LESS CSS目录结构：

  less / 
 core / 
 _main.less 
 header.less 
 body.less 
 footer.less 
 contact / 
 _main.less 
 form.less 
 details。 less 
  

我想写一个Gulp任务来查找 _main。在 less / dir的每个子目录中少于文件，将其传递给gulp-less并将输出写入到 css / b
$ b

  css / 
 core.css 
联系人/  .css 
  

因为 _main.less 包括其目录中的其他文件，只有 _main.less 文件将被解析，但我希望输出文件具有它所在目录的名称。

到目前为止，我有这个：

pre $ g $ c $ gulp.src（'less / * /*/_main.less'）
.pipe（less（））
.pipe（ gulp.dest（ CSS’））;

但是这会创建一个像这样的目录结构：

  css / 
核心/ 
 _main.css 
联络人/ 
 _main.css 
  

但那不是我想要的。我正在考虑使用正则表达式来匹配目录名称，将它返回到匹配 var中，并相应地重命名文件。像这样：

  gulp.src（/ less\ / [^ \ /] + \ /（[^ \ / / +）\ / _main.less /）
 .pipe（less（））
 .pipe（rename（function（context）{
 context.src.matches [1 ] +'.css'
}））
 .pipe（gulp.dest（'css'））; 
  

这段代码仅仅是一个例子。我无法弄清楚如何做这样的事情，或者甚至有可能。

这可能吗？如果是这样，怎么样？

你看起来像你已经有了这个，但也许没有看到 $> b $ b

我甚至不认为你需要使用 RegExp ，这样的事情应该可以工作：

  var rename = require（'gulp-rename'），
 path = require（'path'）; //节点路径
 
 // ... 
 
 gulp.src（'less / ** / _ main.less'）
 .pipe（less（） ）
 .pipe（重命名（函数（filepath）{
 //将文件名替换为父目录的文件名
 filepath.basename = path.basename（filepath.dirname）; 
 //从相对路径删除父目录
 filepath.dirname = path.dirname（filepath.dirname）; 
 //假设扩展名为
}））
 .pipe （gulp.dest（ 'CSS'））; 
  

Say I have a LESS CSS directory structure like this:

less/
    core/
        _main.less
        header.less
        body.less
        footer.less
    contact/
        _main.less
        form.less
        details.less

I want to write a Gulp task that will look for the _main.less files in each subdirectory of the less/ dir, pass this to gulp-less and write the output to the css/ dir like this:

css/
    core.css
    contact.css

Because _main.less includes the other files in it's directory, only the _main.less files will have to be parsed, but I want the output file to have the name of the directory it's in.

So far I have this:

gulp.src('less/*/*/_main.less')
    .pipe(less())
    .pipe(gulp.dest('css'));

But this will create a directory structure like this:

css/
    core/
        _main.css
    contact/
        _main.css

But that's not what I want. I was thinking to use a regex to match the directory name, get this back in a matches var, and rename the file accordingly. Something like this:

gulp.src(/less\/[^\/]+\/([^\/]+)\/_main.less/)
    .pipe(less())
    .pipe(rename(function(context) {
        context.src.matches[1] + '.css'
     }))
    .pipe(gulp.dest('css'));

This code is just an example. I can't figure out how to do something like this, or if it's even possible.

Is this possible? If so, how?

解决方案

You look like you already have this, but maybe didn't see the gulp-rename plugin?

I don't even think you'll need to use a RegExp, something like this should work:

var rename = require('gulp-rename'),
    path = require('path'); // node Path

//...

gulp.src('less/**/_main.less')
    .pipe(less())
    .pipe(rename(function(filepath) {
        // replace file name to that of the parent directory
        filepath.basename = path.basename(filepath.dirname);
        // remove parent directory from relative path
        filepath.dirname = path.dirname(filepath.dirname);
        // leave extension as-is
     }))
    .pipe(gulp.dest('css'));

这篇关于在Gulp中基于regex重命名文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！