Блог

Я экспериментирую с 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(/functions([a-zA-z0-9_$] )/g, (match, name) => {
                      return name   ': function';
                    }))
                }
              )
            )
            .pipe(concat('templates.js', {
              newLine: ','
            }))
            .pipe(wrap('{ <%= contents %> }nr'))
            .pipe(defineModule('es6'))
            .pipe(ins.prepend("import pug from 'vendor/pug-runtime-es6'nr"))
            .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 «.

Обе задачи отлично работают при запуске одна за другой из командной строки. Но когда я запускаю их в gulp.series, это дает

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

Error: write after end
    at writeAfterEnd (C:Programmingjsmillionairenode_modulesreadable-streamlib_stream_writable.js:288:12)
  

Ну, пожалуйста, не говорите мне, что весь этот код и сама идея хм .. неуместны (я знаю это), но проблема указывает на то, что я чего-то не понимаю .. и я не могу с этим жить! ))

Есть идеи?

Буду признателен за любую помощь или хороший совет..