31

Error in plugin "gulp-sass" Message:

gulp-sass 5 does not have a default Sass compiler; please set one yourself. Both the sass and node-sass packages are permitted. For example, in your gulpfile:

var sass = require('gulp-sass')(require('sass'));

This is my code below . It says var sass = require('gulp-sass')(require('sass')); in the error but I am using import and none of the solution worked for me I am new to this and the cli version is 2.3.0 local version is 4.0.2 please give me a solution I am stuck here for days

import gulp from 'gulp';
import sass from 'gulp-sass';
import yargs from 'yargs';


const PRODUCTION = yargs.argv.prod;

export const styles = () => {
    return gulp.src('src/assets/scss/bundle.scss')
      .pipe(sass().on('error', sass.logError))
      .pipe(gulp.dest('dist/asset/css'));
}
askcoder
  • 513
  • 1
  • 5
  • 8
Zia Ansari
  • 343
  • 1
  • 3
  • 6

6 Answers6

68

I had this problem and found that adding the standard sass npm npm install --save-dev sass and then adding the second section of the error message to my variable so that it looks like this const sass = require('gulp-sass')(require('sass')); worked.

Dharman
  • 30,962
  • 25
  • 85
  • 135
mattmakesnoise
  • 780
  • 3
  • 4
  • 1
    I fixed this but only by installing SASS and not the 2nd thing. Adding `(require('sass'))` to the end of my `sass = ` statement just returns `TypeError: sass is not a function`. – Paul Sep 10 '21 at 18:40
  • 7
    It's so bad that after installing the gulp-sass I have to get an error and then google how to fix it. Basically, after installing gulp-sass everyone installs a broken plugin. – KulaGGin Sep 15 '21 at 14:36
  • 1
    As it says to set compiler in your code, sass.compiler = require('sass'); also works fine. – Shashank Bhatt Oct 08 '21 at 19:17
  • installed both gulp-sass and sass and tried adding to the constant, but still get the error. will try and figure out why it's not recognising both are installed – Sandra Aug 03 '23 at 15:17
12

If you, like me, use a modular system. Then this solution should help you!
You need to install SASS
It is also necessary that the gulp-sass be installed

import pkg from 'gulp';
const { src, dest, series, watch } = pkg;
import concat from 'gulp-concat'

import dartSass from 'sass'
import gulpSass from 'gulp-sass'
const sass = gulpSass(dartSass)

function scss() {
    return src('app/scss/**/*.scss', { sourcemaps: true })
        .pipe(sass.sync().on('error', sass.logError)) // scss to css
        .pipe(concat('style.min.css'))
        .pipe(dest(config.build.style, { sourcemaps: '../sourcemaps/' }))
}

async function builds() { scss() }
export { builds }
Brendan8c
  • 369
  • 2
  • 11
3

if I used gulp-sass

import dartSass from 'sass';
import gulpSass from 'gulp-sass';
const sass = gulpSass( dartSass );

else if I used node-sass

import gulpSass from "gulp-sass";
import nodeSass from "node-sass";
const sass = gulpSass(nodeSass);

on another state when I used required

var sass = require('gulp-sass')(require('sass'));
hossein naghneh
  • 469
  • 7
  • 11
3

I got same error and i did follow.

1. At first I installed gulp-sass

   npm install sass gulp-sass --save-dev

2. Then on my gulpfile.babel.js I added

   import gulpsass from 'gulp-sass';

3. And lastly above the function I added

   var sass = require('gulp-sass')(require('sass'));

Here is the final image of my gulp file:

Final image

skomisa
  • 16,436
  • 7
  • 61
  • 102
2

I had the same problem. This is my solution:

npm install sass
npm install gulp-sass
My version sass -"^1.51.0" and gulp-sass - "^5.1.0" in package.json

const sass = require('gulp-sass')(require('sass'));

gulp.task('styles', () => (
    gulp.src('src/**/*.scss')
         .pipe(sass())
         .pipe(concat('style.css'))
         .pipe(gulp.dest('public'))
))
1

You need just istall in aditional SASS

In terminal:

npm i sass

And replace:

sass = require('gulp-sass');

For: sass = require('gulp-sass')(require('sass'));