Gulp message: Couldn't open browser

Improved title.

I've experimented a bit, and changed gulpfile.js to not use browserSync. It now looks like this:

let gulp = require('gulp'),
  sass = require('gulp-sass'),
  sourcemaps = require('gulp-sourcemaps'),
  cleanCss = require('gulp-clean-css'),
  rename = require('gulp-rename'),
  postcss = require('gulp-postcss'),
  autoprefixer = require('autoprefixer')

const paths = {
  scss: {
    src: './scss/style.scss',
    dest: './css',
    watch: './scss/**/*.scss',
    bootstrap: './node_modules/bootstrap/scss/bootstrap.scss'
  },
  js: {
    bootstrap: './node_modules/bootstrap/dist/js/bootstrap.min.js',
    jquery: './node_modules/jquery/dist/jquery.min.js',
    popper: 'node_modules/popper.js/dist/umd/popper.min.js',
    popper: 'node_modules/popper.js/dist/umd/popper.min.js.map',
    dest: './js'
  }
}

// Compile sass into CSS & auto-inject into browsers
function styles () {
  return gulp.src([paths.scss.bootstrap, paths.scss.src])
    .pipe(sourcemaps.init())
    .pipe(sass().on('error', sass.logError))
    .pipe(postcss([autoprefixer({
      browsers: [
        'Chrome >= 35',
        'Firefox >= 38',
        'Edge >= 12',
        'Explorer >= 10',
        'iOS >= 8',
        'Safari >= 8',
        'Android 2.3',
        'Android >= 4',
        'Opera >= 12']
    })]))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(paths.scss.dest))
    .pipe(cleanCss())
    .pipe(rename({ suffix: '.min' }))
    .pipe(gulp.dest(paths.scss.dest))
}

// Move the javascript files into our js folder
function js () {
  return gulp.src([paths.js.bootstrap, paths.js.jquery, paths.js.popper])
    .pipe(gulp.dest(paths.js.dest))
}

const build = gulp.series(styles, gulp.parallel(js))

exports.styles = styles
exports.js = js

exports.default = build

 
This makes gulp run and terminate without a glitch, and generates the css from the scss. I.e. it produces fresh copies of:

css/bootstrap.css
css/bootstrap.min.css
css/style.css
css/style.min.css

 
One strange thing remains. When I visit the front page with my regular browser, the site appear unstyled.

However, if I visit settings and change theme settings and change the setting for "Google Fonts combination" from "None" to anything else, the site are styled by the subtheme. Weird.

I do not use generated css sourcemaps for anything, so I can't tell you if they work for me (but if you think they should be generated anyway, tell me where to look and what to look for, and I'll check again).

OP here. Everything I know about this is already in the issue summary nd my subsequent comments.

This is a support request where I hope the one of the maintainers of the project would chip in provide some more documentation.

I added the line as suggested in comment #9.

It still looks like the processing gulpfile.js does something weird (i.e. it starts up and outputs "Reloading browsers" and never terminates to show the CLI prompt).

I am on a Ubuntu 20.04 LTS cloud server, not MS Windows (WSL2). I don't know whether that makes a difference.

Just adding "open: false," will at least get gulp going and monitoring any changes.

What does that mean? I've no problem getting gulp going. My problem is that it does not terminate, but stays active. I don't want it "monitoring any changes", but simply process the files and return to the CLI prompt.

I notice that it monitors the changes I make to the SCSS markip and also regenerates the CSS to reflect those changes. Is this how it is supposed to work?

Thanks! I' understand how this is supposed to work now. Could be better documented tho'