Gulp-sass 5.0 how to use compiler with import() instead of require()?
Asked Answered
R

5

18

Gulp-sass recently updated to version 5.0. They describe that it doesn't include a compiler anymore and they say you have to install in separately.

They have documentation on how to let gulp-sass require the compiler with this piece of code.

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

But im using import() instead of require() and i can't find out how to translate the code they provided with require() to import().

This is also the error i get:

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'));

For now i rolled back to version 4.1.1 which included the compiler but i would like to update it to version 5.0 at some point.

Roxi answered 29/6, 2021 at 9:48 Comment(0)
A
20
import gulpSass from "gulp-sass";
import nodeSass from "node-sass";
    
const sass = gulpSass(nodeSass);

Try this. But I still don't know if this is the best.

  • I know "node-sass" should be deprecated. Just an example. use "dart-sass" or "sass"
Aqueous answered 30/6, 2021 at 2:30 Comment(1)
How fix problem if gulpfile.js don't want add import ? import gulpSass from "gulp-sass"; ^^^^^^ SyntaxError: Cannot use import statement outside a module Homicide
B
7

From sass github repository

import dartSass from 'sass';
import gulpSass from 'gulp-sass';
const sass = gulpSass( dartSass );
Babysit answered 7/7, 2021 at 12:24 Comment(0)
R
2

You cannot use import statement within the body of your code. It must be used at the beginning of the file (see https://flexiple.com/javascript-require-vs-import/#:~:text=One%20of%20the%20major%20differences,js%20extension%20as%20opposed%20to%20.)

If you or anyone is looking for how to implement the gulp code. I found a direction on Reddit https://www.reddit.com/r/webdev/comments/o9okup/error_with_gulpsass_setup/ a user - "LessRain" provided an answer:

To install node-sass navigate to your project directory in terminal and run this command: npm install gulp gulp-sass node-sass gulp-concat --save-dev

Then you can swap sass = require('gulp-sass'); for const sass = require("gulp-sass")(require("node-sass"));

In my case that code went into a gulpfile.js file but since it is part of a statement I had no need for "const"

let gulp = require('gulp'),sass = require("gulp-sass")(require("node-sass")),...
Remora answered 29/6, 2021 at 18:30 Comment(2)
why do we need two brackets at the end if only one is open?Sexennial
@Sexennial the last bracker closes the thrid 'require' functionRemora
L
0

(from error description)

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

Longing answered 23/7, 2021 at 8:55 Comment(2)
why do we need two brackets at the end if only one is open?Sexennial
The answer was from npm: npmjs.com/package/gulp-sass. You can try without that brackets but I suppose that it's used for multiple tasks.Longing
N
0

What worked for me was using npm install sass not using -g.

Neustria answered 29/7, 2021 at 5:40 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.