gulpを用いたPostCSSが機能しません

Question

前提・実現したいこと

gulpを用いて「ベンダープレフィックスの自動付与」や「CSSプロパティの記述順の自動ソート」等をしたいのですが、書籍の通り記述してもうまく機能しません。

※Sassからcssへのコンパイルはされています。

ファイル構成とgulpfile.jsは以下です。

わかる方がいらっしゃいましたらご教示いただけますと幸いです。

該当のソースコード

var gulp = require('gulp');
var sass = require('gulp-sass');
var sassGlob = require('gulp-sass-glob');
var sourcemaps = require('gulp-sourcemaps');
var plumber = require('gulp-plumber');
var notify = require("gulp-notify");
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var assets = require('postcss-assets');
var cssdeclsort = require('css-declaration-sorter');
var mqpacker = require('css-mqpacker');


gulp.task('sass', function() {
  return gulp.src('./css/**/*.scss')
    .pipe(plumber({errorHandler: notify.onError("Error:<%= error.message %>")}))
    .pipe(sourcemaps.init())
    .pipe(sassGlob())
    .pipe(sass({outputStyle: 'expanded'}))
    .pipe(postcss([mqpacker()])) //
    .pipe(postcss([cssdeclsort({order: 'smacss'})]))
    .pipe(postcss([assets({
      loadPaths: ['./images']
    })]))
    .pipe(postcss([autoprefixer()]))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('./css'));
})

gulp.task('sass:watch', function() {
  gulp.watch('./css/**/*.scss', gulp.task('sass'));
});

{
  "name": "02_sassbook",
  "version": "2.0.2",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^4.0.2",
    "gulp-sass": "^4.1.0"
  }
}