Gulp SASS, Autoprefixer and Sourcemaps

Question

I'm using the _s (underscores) starter WordPress theme and trying to use my own gulp script to do the following:

• compile sass files from ./sass/ (there are many scss files that are all added as 'imports' into ./sass/style.scss)
• autoprefix my CSS
• create a sourcemap file
• compile/autoprefix/sourcemapped files should reside in the root of the theme (./) named style.css and style.css.map

I have it working with no errors - where it does generate my style.css and style.css.map - but it just doesn't add browser prefixes. It's like the autoprefixer plugin isn't working.

How do I get autoprefixer to prefix my css? I tested it by adding transition: all .5s, display: grid, and they don't get prefixed.

There is no error either, so I'm at a loss.

Here is my gulpfile.js

'use strict';
var gulp = require('gulp');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
sass.compiler = require('node-sass');

gulp.task('sass', function () {
   return gulp.src('./sass/**/*.scss')
   .pipe(sass().on('error', sass.logError))

    // Compile Sass
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('./'))

    // Autoprefix
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(autoprefixer())
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('./'))
});

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