postcss / gulp-postcss

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

s.default.isPseudoElement is not a function #184

Closed davshoward closed 10 months ago

davshoward commented 1 year ago

Node version = 16.18.0 npm version = 8.19.2

"gulp-postcss": "^9.0.1",
"postcss": "^8.4.16",
"postcss-import": "^14.1.0",
"postcss-nested": "^5.0.6",
"postcss-preset-env": "^7.8.0",

Styles Gulp task

const { src, dest } = require('gulp');
const gulpif = require('gulp-if');
const config = require('../config').styles;
const env = require('../lib/env');
const handleErrors = require('../lib/handleErrors');
const browserSync = require('browser-sync');

const sourcemaps = require('gulp-sourcemaps');
const postcss = require('gulp-postcss');
const cssnano = require('gulp-cssnano');

const styles = () =>
    src(config.src)
        .pipe(gulpif(!env.prod, sourcemaps.init()))
        .pipe(postcss())
        .pipe(gulpif(env.prod, cssnano({ autoprefixer: false })))
        .pipe(gulpif(!env.prod, sourcemaps.write('./')))
        .on('error', handleErrors)
        .pipe(dest(config.dest))
        .pipe(browserSync.stream());

module.exports = styles;

Getting the following error when trying to run gulp.

TypeError in plugin "gulp-postcss"
Message:
    s.default.isPseudoElement is not a function

It's unlikely to be a code error as it works on colleague's machines with the same NPM/Node versions.

Any ideas on what is causing this?

w0rm commented 10 months ago

Probably an error because of some version mismatch of postcss and its plugins. gulp-postcss simply runs postcss.

I'm not sure why are you running cssnano and autoprefixer as gulp plugins, and not as postcss plugins from gulp-postcss.