Questions tagged [gulp-sass]

a gulp plugin for compilation of Sass to CSS.

gulp-sass is a gulp plugin for compilation of Sass files to CSS files.

Basic example of usage:

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

gulp.task('sass', function () {
  gulp.src('./sass/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest('./css'));
});

The plugin can also be used with gulp-sourcemaps:

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

gulp.task('sass', function () { 
  gulp.src('./sass/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(sourcemaps.write('./sourcemaps'))
    .pipe(gulp.dest('./css'));
});

gulp-sass accepts node-sass compatible options, e.g.:

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

gulp.task('sass', function () {
  gulp.src('./sass/**/*.scss')
    .pipe(sass({ outputStyle: 'compressed' }))
    .pipe(gulp.dest('./css'));
});
749 questions
0
votes
2 answers

Gulp compiling files to dest folder and src folder

My gulpfile is adding the compiled css and js files to both the dest (css / js) folders and the src (scss / coffee) folders. The desired outcome is that the compiled files only print to the dest folders. This is only happening when running gulp on…
0
votes
1 answer

Using PostCSS with Sass in Gulp to run font-awesome

Hi guys am trying to use font-awesome in my postcss layout but it seems not to work. So i tried installing sass with posts to see if it will work but i do not know how to go about it. I already installed npm gulp for sass This is my gulp file…
Arthur Decker
  • 1,191
  • 3
  • 15
  • 45
0
votes
1 answer

How to use SassDoc as parser for single file without generating full documentation files

Question relates to http://sassdoc.com package I would like to parse each *.scss file in ./source folder, but instead of generating sassdoc folder i would like to create partial-html for each parsed file. For example: parse: variables.scss and…
Dariusz Sikorski
  • 4,309
  • 5
  • 27
  • 44
0
votes
0 answers

Gulp refuses to compile scss files with @import in them

I have been working on a website and used Gulp to compile my scss files. However, the main.scss file quickly gained in the number of lines and I decided to split it in different files and then import into a single one which will be compiled to…
sheriff_paul
  • 995
  • 2
  • 14
  • 29
0
votes
1 answer

Compile sass with gulp-sass

I'm trying to compile some .scss with the following Gulp task: var gulp = require("gulp"), rimraf = require("rimraf"), concat = require("gulp-concat"), cssmin = require("gulp-cssmin"), uglify = require("gulp-uglify"), sass =…
ale
  • 10,012
  • 5
  • 40
  • 49
0
votes
1 answer

Browser-sync not reloading after SASS compiling

I am trying to make it so after I save a change to my *.scss files that the browser-sync window reloads. It currently works fine when I save *.html files but I am not sure how to get it working for the SASS files. Here is my gulp file. var gulp =…
Guerrilla
  • 13,375
  • 31
  • 109
  • 210
0
votes
1 answer

gulp failed on Jenkins, but succeed on my VM

I am pretty new to npm and nodejs. what does the output mean? How to debug? some version info: 10:29:33 + echo ==========================+ 10:29:33 ==========================+ 10:29:33 + which node 10:29:33 /usr/bin/node 10:29:33 + echo…
BAE
  • 8,550
  • 22
  • 88
  • 171
0
votes
1 answer

GULP watch not working in my gulp.js file

Hi im trying to get a gulp watch on the go in my gulp.js file. It needs to run my sass and minify it and set to destination folder on watch. Can anybody help please? var gulp = require('gulp'); var sass = require('gulp-sass'); var minifyCss…
Doddsy
  • 47
  • 2
  • 8
0
votes
2 answers

Gulp-sass and Browser Sync

I am not sure if the problem is browser-sync but that would be my best bet. My problem is I am using gulp to automate my workflow for the first time. And when I "gulp things" it runs it opens a new webpage with my project like it should, but when I…
0
votes
1 answer

Gulp not notifying JS errors and not compiling scss files on running gulp

I've been trying to improve my standard gulpfile to notify when errors occur when compiling scss and JS. SCSS Issue I have it working for SCSS, it throws the error in terminal, makes a noise and doesn't stop gulp running - which is great.…
jx3
  • 921
  • 1
  • 7
  • 22
0
votes
1 answer

Gulp-sass how to change dest output

I'm trying to set a shopify dev workflow, and i'm stuck in a problem. How can i change the dest() output in gulp-sass to use .liquid files in the assets folder? gulp.task('sass', function() { gulp.src('stylesheets/*.scss') …
0
votes
0 answers

Gulp is getting stuck on my task

I'm pretty new to gulp, so I'm stumbling around a bit. I was fine up until the point I wanted to add sourcemaps to my project, now my gulp gets stuck after running the default task and doesn't seem like it will ever start my 'css' task. Since, I'm…
Kathryn Crawford
  • 611
  • 1
  • 10
  • 27
0
votes
1 answer

Can't get gulp to output to the source directory

I'm trying to get gulp to compile my SASS files and output them to the same source dir however I haven't been able to get it to work properly, I've tried using the base option: gulp.task('sass_modules', function() { return…
0
votes
2 answers

gulp.dest to be same as the current file?

I'm trying to pipe my compiled .css file to same directory as its original .scss one gulp.task('sass', function() { return gulp.src([ appDir + '/*.scss', appDir + '/**/*.scss' ]) .pipe(sass()) .pipe(gulp.dest(..)); }); I can't…
Ilja
  • 44,142
  • 92
  • 275
  • 498
0
votes
1 answer

Gulp doesn't work when multiple tasks are run

I'm trying to grap my head around gulp. I managed to write gulpfile.js for my basic page scaffolding, but i've problems with running serveral task in order. I'm trying to generate css/main.css file from scss files, copy it to dist/css/ and then…
kmiasko
  • 56
  • 1
  • 3