postcss / gulp-postcss

Pipe CSS through PostCSS processors with a single parse
MIT License
769 stars 65 forks source link

Error plugin is not a function #177

Closed Yuriy-Svetlov closed 3 years ago

Yuriy-Svetlov commented 3 years ago

Hi!

Thank you for your plugin!) But I get error when installed gulp-postcss - 8 and postcss - 8.

Error

[14:06:50] 'css' errored after 1.95 s
[14:06:50] TypeError in plugin "gulp-postcss"
Message:
    plugin is not a function
Details:
    fileName: E:\1\src\css\1.css
    domainEmitter: [object Object]
    domainThrown: false

Stack:
TypeError: plugin is not a function
    at LazyResult.run (E:\1\node_modules\gulp-postcss\node_modules\postcss\lib\lazy-result.js:288:14)
    at LazyResult.asyncTick (E:\1\node_modules\gulp-postcss\node_modules\postcss\lib\lazy-result.js:212:26)

...

NodeJs - v14.17.1

  "devDependencies": {
    "cssnano": "^5.0.8",
    "gulp": "^4.0.2",
    "gulp-plumber": "^1.2.1",
    "gulp-postcss": "^8.0.0",
    "gulp-sass": "^4.1.0",
    "live-alert-bp": "^1.0.0",
    "postcss": "^8.3.11"
  }
const 
  gulp = require('gulp'),
  liveAlertBP = require("live-alert-bp"),
  plumber = require('gulp-plumber'),
  gulpSass = require('gulp-sass'),
  postcss = require('gulp-postcss'),
  cssnano = require('cssnano');

const 
  sassWatch = 'src/scss/*.scss',
  sassSrc = ['src/scss/*.scss'],
  sassDest = 'src/css';

const 
  cssSrc = ['src/css/*.css'],
  cssDest = '/build/css';

const 
  liveAlert = new liveAlertBP({host: '127.0.0.1', port: '8080'});

function sass() {
  return gulp.src(sassSrc)
    .pipe(plumber({errorHandler: onError}))        
    .pipe(gulpSass().on('error', gulpSass.logError))   
    .pipe(gulp.dest(sassDest));
}

function css() {
  return gulp.src(cssSrc)  
    .pipe(postcss([
        cssnano({zindex: false, reduceIdents: false})
    ]))    
    .pipe(gulp.dest(cssDest));
}

function liveAlertCSS(cb){
    liveAlert.close();
    liveAlert.reloadNotification();
    liveAlert.resetError();

  cb();
}

function onError(err){
  if(liveAlert.hasError() === false){
    if(err.plugin === 'gulp-sass'){

      // Without using the formatter
      // ----------------------------------
      liveAlert.open([
        { label: 'File', message: err.file },
        { label: 'Message', message: err.message }
      ]);
      // ----------------------------------

    }
  }

  this.emit('end');
}

function watch(){
  liveAlert.run();

  gulp.watch(sassWatch, gulp.series(sass, css, liveAlertCSS));
}

exports.sass = sass;
exports.css = css;
exports.watch = watch;
exports.liveAlertCSS = liveAlertCSS;
w0rm commented 3 years ago

Hello 👋

Can you try bumping gulp-postcss version to the latest one? gulp-postcss 9.0.1 works with postcss 8. These packages are developed independently and their versions are not kept in sync.

You can see this info in the changelog https://github.com/postcss/gulp-postcss#changelog

Yuriy-Svetlov commented 3 years ago

Hello 👋

Can you try bumping gulp-postcss version to the latest one? gulp-postcss 9.0.1 works with postcss 8. These packages are developed independently and their versions are not kept in sync.

You can see this info in the changelog https://github.com/postcss/gulp-postcss#changelog

@w0rm Thank you very much!) It works well!