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
1 answer

Compiling Sass for Foundaiton 6 using Gulp Sass Task Provides No CSS in Generated File

I put together this gulp task using the docs to compile down my application Sass, but it doesn't seem to build any of the Foundation 6 Sass files except for the initial comment in foundation.scss. // gulp task 'use strict'; var path =…
mtpultz
  • 17,267
  • 22
  • 122
  • 201
0
votes
1 answer

Compile scss to scss and don't apply functions that are not defined

There's some ruby-on-rails project with a lot of scss files. Images stored in cloudinary.com cdn. Inside source scss files there's such construction: .test { background-image: cloudinary-url("somepic.png",$width:10,$height:10); } Then we try to…
Kasheftin
  • 7,509
  • 11
  • 41
  • 68
0
votes
1 answer

Gulp doesn't detect change

I have a problem with my Gulp installation. On running SASS, it detects change, run gulp-sass, but dosen't push any change, and says the following: [17:48:30] Starting 'sass'... [BS] 0 file changed () [17:48:30] Finished 'sass' after 12 ms As you…
Félix Desjardins
  • 3,223
  • 3
  • 21
  • 36
0
votes
1 answer

gulp-json-sass - Cannot include json file

Source link - I don't know what is missing here Everything fine if I am not including json file 1) gulpfile.js var jsonSass = require('gulp-json-sass'), gulp = require('gulp'), concat = require('gulp-concat'), sass =…
ShibinRagh
  • 6,530
  • 4
  • 35
  • 57
0
votes
2 answers

How to setup gulp for this type of scaffolding?

Folder Structure Components ------component1 -partials - js - html - scss - component1.css - component1.js ------component2 -partials -…
Kinny
  • 47
  • 1
  • 1
  • 10
0
votes
1 answer

Ionic Custom colors - SASS

I am a newbie for Ionic and sass framework. I am trying add custom colors for my app so i am trying to update ionic.app.scss file located inside scss folder. So , if i try to override an existing variable say : $assertive : #F35C6 !default;…
Tushar Agarwal
  • 521
  • 1
  • 16
  • 39
0
votes
1 answer

How can I set up a watcher to copy files to other files inside same folders?

Here's what I have so far and what I have tried: In my application I have files with a structure like…
Alan2
  • 23,493
  • 79
  • 256
  • 450
0
votes
1 answer

"gulp-sass": 2.1.1 - how to log errors at compile time

I'm using "gulp-sass": 2.1.1 to compile my project. I'm having some issues identifying where the missing files are from. Whats the best way to logout this error information. Is there a flag or something I can set whilst compiling? Jimi
Jimi
  • 1,867
  • 7
  • 31
  • 55
0
votes
0 answers

Gulp sass errors silently

I am trying to use gulp-sass to compile my scss files, but for some reason it is failing but not displaying an error message. This is the command output for gulp styles: [20:40:04] Requiring external module babel-core/register [20:40:05] Using…
muuk
  • 932
  • 1
  • 7
  • 15
0
votes
1 answer

browserSync + Gulp, getting error => TypeError: _.contains is not a function

I've installed browserSync to get my browsers to auto refresh if I update CSS or html templates. In my gulp file: var browserSync = require('browser-sync').create(); And down by my watch tasks: // Static Server + watching scss/html…
Leon Gaban
  • 36,509
  • 115
  • 332
  • 529
0
votes
1 answer

Specify input directory for Laravel Elixir/SASS

I currently have my resources/assets directory structured a bit differently from normal as I want to have a number of "themes" in my project. Currently I have the following…
Jonathon
  • 15,873
  • 11
  • 73
  • 92
0
votes
1 answer

How to use source file's path from gulp.src in gulp.dest?

I want to run gulp sass task and obtain smth like this: From: /app /componentA fileA.scss /componentB fileB.scss /componentC fileC.scss /dist /componentA /componentB /componentC To: /app /componentA fileA.scss …
0
votes
2 answers

Cant't install Gulp-Sass (Node-Sass) on Raspbian (Raspberry)

I'm trying to install node-sass or gulp-sass on my Raspberry Pi, I have these errors : npm WARN deprecated npmconf@2.1.2: this package has been reintegrated into npm and is now out of date with respect to npm npm WARN deprecated…
Xad31
  • 1
  • 2
0
votes
1 answer

sourceComment in Gulp is showing path relative to computer, rather than folder

I have been doing sourceComments for a project I am working with and the comments that get outputted in the CSS so that I can find the correct scss file are showing paths that are relatvie to my computer e.g. /* line 39,…
Philip
  • 569
  • 2
  • 5
  • 27
0
votes
2 answers

How to build bootstrap using jspm and bootstrap-sass

I'm just starting to dig into SASS, and trying to figure out how to build bootstrap from the bootstrap-sass module installed with jspm as a "dev dependency" - which I'm not sure is correct. I installed sass from ruby gems. Since I'm using jspm, do…
John Manko
  • 1,828
  • 27
  • 51