I tried to run the gulp to covert SCSS to CSS，the gulp is working wihout any error but there aren't have any css files output to the target folder, I also tried to change the output path but it still didn't work，and my code is below :

// gulpfile.js
var gulp = require('gulp');
var sass = require('gulp-sass')(require('node-sass'));
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
var plumber = require('gulp-plumber');
var browserSync = require('browser-sync').create();
var notify = require('gulp-notify');
var sassLint = require('gulp-sass-lint');

var styleLink = {
    sassLink: 'src/**/*.(scss|sass)',
    OutputLink: '../css'
}
var browserSyncLink = {
    root: '../',
    watchHtml: '../*.html',
    watchJS: '../*.js'
}

// notify
function showErrorNotify(error) {
  var args = Array.prototype.slice.call(arguments);
  // Show notification
  notify.logLevel(0);
  notify
    .onError({
      title: '['   error.relativePath   '] Error',
      message: '<%= error.messageOriginal %>',
      sound: 'Pop'
    })
    .apply(this, args);

  // Keep gulp from hanging on this task
  this.emit('end');
}

// sass task
function sassTask() {
  return gulp.src(styleLink.sassLink, { sourcemaps: true })
        .pipe(sass()) // compile SCSS to CSS
        .pipe(autoprefixer())
        .pipe(gulp.dest('./', { sourcemaps: '.' }));
}

function browserSyncServer(cb) {
  browserSync.init({
    server: {
      baseDir: browserSyncLink.root
    }
  })
  cb();
}

function browserSyncLoad(cb) {
  browserSync.reload();
  cb();
}

function sassLinkTask() {
  return gulp
    .src(styleLink.sassLink)
    .pipe(
      plumber({
        errorHandler: showErrorNotify
      })
    )
    .pipe(sassLint())
    .pipe(sassLint.format())
    .pipe(sassLint.failOnError());
}

function watchTask() {
  gulp.watch('../*.html', browserSyncLoad);
  gulp.watch(['src/**/*. (scss|sass)', '../js/*.js'], gulp.series(gulp.parallel(sassTask, sassLinkTask), browserSyncLoad));
}

exports.default = gulp.series(gulp.parallel(sassTask, sassLinkTask), browserSyncServer, watchTask);

when I ran this code i alos didn't get any error.

It seems no error..

Could anyone please help me ? Thanks. and please excuse my poor English...

CodePudding user response：

In your watchTask you have this:

src/**/*. (scss|sass) note the sign before the alternation.

But in your styleLink variable you have:

var styleLink = {
    sassLink: 'src/**/*.(scss|sass)',
    OutputLink: '../css'
}

Change to sassLink: 'src/**/*. (scss|sass)',