gulp.dest with glob gulp.src - 使其成为相对的

Question

我在 gulp 中有一个简单的任务应该是转译 js:

function js() {
  return gulp.src('lib/modules/*/source/js/*.js')
    .pipe(babel({
      presets: ['@babel/env']
    }))
    .pipe(gulp.dest((fileVinyl) => {
      return fileVinyl.path.replace('/source/', '/public/').replace(/[^\/]*js$/, '')
    }))
}

exports.default = gulp.parallel(js)

我的文件结构如下：

lib
- modules
  - module1
    - source
      - js
        - file.js
  - module2
    - source
      - js
        - file.js
  - moduleN (...)

现在，我希望它创建这样的文件：

lib
- modules
  - module1
    - public
      - js
        - file.js
    - source (...)
  - module2
    - public
      - js
        - file.js
    - source (...)
  - moduleN (...)

当然，上面的代码是行不通的，它将文件输出到lib/modules/module1/public/js/module1/source/js/这样的文件夹中。有什么方法可以强制 gulp 将文件输出到指定路径，而不是将其视为附加自己想法的基本路径？

Answer 1

在gulp.src

中使用选项base

像这样：

gulp.src('your_file.js', {base: 'your_base_path'})
.pipe(/*...*/)

在您的情况下，base 应该是 lib/modules

像这样：

gulp.src('lib/modules/**/*.js', {base: 'lib/modules'})
.pipe(/*...*/)
.pipe(gulp.dest('lib/modules'))

这将创建您想要的内容：

lib
- modules
  - module1
    - public
      - js
        - file.js

此选项告诉 gulp 忽略路径的基础部分并将路径的其余部分视为相对路径，因此将其复制到 dest

Answer 2

我遇到的问题是文件的基础错误。但由于我需要动态更改它，我不能只在 src 选项中设置它。幸运的是，我可以在 dest 函数中轻松更改它，其中我有可用的路径：

 .pipe(gulp.dest((fileVinyl) => {
      //changing the base so that it will include the whole path to the file,
      //excluding the filename
      fileVinyl.base = fileVinyl.path.replace(/[^\/]*js$/, '')

      //outputing the file to a /public/ folder instead of /source/,
      //keeping the structure
      return path.relative(process.cwd(), fileVinyl.path.replace('/source/', '/public/').replace(/[^\/]*js$/, ''))
    }))

gulp.dest with glob gulp.src - 使其成为相对的

gulp.dest with glob gulp.src - making it relative

javascript

cwd

node.js

gulp