gulp - autoprefixer と minify の両方を gulp で監視するにはどうすればよいですか?

Question

私のフォルダー構造は、私が書いているファイルであるstyle.cssを格納する「production」というディレクトリで構成されています...自動接頭辞付きのstyle.cssファイルの宛先である「css」という別のディレクトリがあります。私が設定したウォッチ タスクはオートプレフィクサーに対して完全に機能しますが、ミニファイ タスクは、新しく作成されたオートプレフィックス付きの css をミニファイ バージョンでオーバーライドする際にウォッチ タスクを介して機能しません。私はgulpが初めてです...どんな助けでも大歓迎です!

これが私がやっていることです：

var gulp = require('gulp');
var autoprefixer = require('gulp-autoprefixer');
var cleanCSS = require('gulp-clean-css');

gulp.task('styles',function() {
    gulp.src('production/style.css')
        .pipe(autoprefixer())
        .pipe(gulp.dest('css'))
});

gulp.task('minify-css',function() {
    gulp.src('css/style.css')
        .pipe(cleanCSS({compatibility: 'ie8'}))
        .pipe(gulp.dest('css'));
});

gulp.task('watch',function() {
    gulp.watch('production/style.css', ['styles']);
    gulp.watch('css/style.css', ['minify-css']);
});

ファイル構造:

-web-project
   -css
      -style.css

   gulpfile.js
   index.html

   -node_modules

   package.json

   -production
      -style.css