How to collect all styl-files in 1 css?

Question

css

The question is simple and frequent, but the answer could not be found here.
There are two adjacent folders with directories that contain styl files. Previously, I wrote each new styl to this file, then I thought about it and simply abandoned all the styl files that would be created in the directories:

@import 'blocks/*'
@import 'helpers/*'

Everything seems to work, however, when making changes to the files, the page does not reload. Probably something needs to be added to the gulpfile, but I would like to just collect all these styl files into one clean css file.
There is some solution with gulp-filter , but I don't want to have a lot of css files or write a task for their subsequent removal :)
Just in case, I'll drop the current change tracking task

gulp.task('serve', ['styl'], function() {
  server.init({
    server: 'src',
    notify: true,
    open: true,
    cors: true,
    ui: false
  });
  gulp.watch('src/blocks/**/*.styl', ['styl']);
  gulp.watch('src/blocks/**/*.pug', ['pug']);
  gulp.watch('src/*.html').on('change', server.reload);
  gulp.watch('src/css/main.css').on('change', server.reload);
  run(
    'pretty'
  );
});

Thanks in advance for your advice.

Answer 1

https://ru.stackoverflow.com/a/649283/33274