2

我正在试验 gulp-4 并遇到了一个问题：

我有类似于 .vue 的文件

<template lang="pug">
  // ...
</template>

<style lang="scss">
  // ...
</style>

并有 2 个任务：

gulp.task('precompile', () => {
  return gulp.src(['./src/frontend/views/components/**/*.vue',
                   './src/frontend/views/components/**/*.pug',
                   './src/frontend/vendor/**/*.pug'])
            .pipe(vueFilter)
            .pipe(extract('<template lang=\\"pug\\">','<\\/template>'))
            .pipe(ext_replace('.pug'))
            .pipe(vueFilter.restore)
            .pipe(
              foreach(
                (stream, file) => {
                  console.log(file.path)
                  return stream
                    .pipe(pug({
                      client: true,
                      pretty: true,
                      compileDebug: false,
                      debug: false,
                      inlineRuntimeFunctions: false,
                      name: 'render_' + path.basename(file.path, '.pug')
                    }))
                    .pipe(replace(/function\s([a-zA-z0-9\_\$]+)/g, (match, name) => {
                      return name + ': function';
                    }))
                }
              )
            )
            .pipe(concat('templates.js', {
              newLine: ','
            }))
            .pipe(wrap('{ <%= contents %> }\n\r'))
            .pipe(defineModule('es6'))
            .pipe(ins.prepend("import pug from 'vendor/pug-runtime-es6'\n\r"))
            .pipe(prettier())
            .pipe(gulp.dest('./src/frontend/views'));
});

和这个：

gulp.task('prepare-sass', () => {
  return gulp.src(['./src/frontend/views/components/**/*.vue', './src/frontend/views/components/**/*.scss'])
            .pipe(vueFilter)
            .pipe(extract('<style lang=\\"scss\\">','<\\/style>'))
            .pipe(ext_replace('.scss'))
            .pipe(vueFilter.restore)
            .pipe(gulp.dest('./src/frontend/views/sass/temp'));
});

可能看起来很复杂，但实际上并非如此：第二个只是提取样式，然后将它们复制到目标文件夹，而第一个提取 pug 代码，预编译它，然后合并到一个文件“templates.js”中。

从 cli 一项一项运行时，这两项任务都能完美运行。但是当我在 gulp.series 中运行它们时，它给出了

events.js:174
      throw er; // Unhandled 'error' event
      ^

Error: write after end
    at writeAfterEnd (C:\Programming\js\millionaire\node_modules\readable-stream\lib\_stream_writable.js:288:12)

好吧，请不要告诉我所有这些代码和想法本身都是嗯..无关紧要（我知道），但问题表明我误解了某些东西..我不能忍受它！))

有任何想法吗？

将不胜感激任何帮助或好的建议..

4

0 回答 0