FAQ Database Discussion Community


Gulp configuration not working

gulp,gulp-watch,gulp-sass,gulp-concat,gulp-uglify
I'm trying to run Gulp to minify CSS, JS and move all the static stuffs (template, font, img) into build folder. My project directory structure: - project |- gulpfile.js |- package.json |- src ||- font ||- img ||- js ||- sass ||- template |- build ||- css ||- font ||-...

Gulp-sass not finding variable in included files(s)?

node.js,sass,gulp,gulp-sass
I have a _variables.scss file where a map is declared: $chord1: ( color1: rgb(0, 155, 223), color2: rgb(114, 191, 68), color3: rgb(207, 9, 137), color4: rgb(62, 83, 164) ); $chord: $chord1; I have a second file. _globals.scss where I reference this: .myClass { color: map-get($chord, color1); } I have a...

Media queries don't do anything

html,css,css3,sass,gulp-sass
I've been doing HTML and CSS with SASS for a while and all my responsive was working until today, suddenly my css media queries stopped reacting. They are in the css file that is being loaded on the web page, but no elements react to them ... I can't copy...

gulp.dest() ignoring subdirectory

node.js,gulp,gulp-sass
My Folder Tree public_html/ - css/ - - bootstrap.css - - theme.css - scss/ - - bootsrap/ - - - bootstrap.scss - - theme/ - - - theme.scss My gulpfile : var gulp = require('gulp'); //Plugins var sass = require('gulp-sass'); var autoprefixer = require('gulp-autoprefixer'); var sourcemaps = require('gulp-sourcemaps'); var scssPath...

Building Ionic Sass using Compass still looking for Removed Sass task

sass,gulp,ionic,gulp-sass,gulp-compass
Using an ionic blank template with its default gulpfile and running: ionic setup sass I can build the application's Sass, but I wanted to add Compass. So using Gulp I added the below code to my gulpfile based on gulp-compass examples: gulp.task( 'compass', function( done ) { gulp.src( './scss/ionic.app.scss' )...

Gulp command stops with Error: spawn ENOTDIR

node.js,gulp,gulp-sass
I recognize that there are many similar questions, but none with a solution that I can find. I am trying to compile Sass and JS but am getting the following error: Error: spawn ENOTDIR at exports._errnoException (util.js:746:11) at ChildProcess.spawn (child_process.js:1162:11) at exports.spawn (child_process.js:995:9) ... and so on... It appears that...

Watch multiple directories using gulp-sass

sass,gulp,gulp-sass
I have .scss files in two different directories: ./blog/styles/ ./common/styles/ There is a file in ./blog/styles called blog.scss and I'm importing .scss files from ./blog/styles/ (i.e. same directory) and ./common/styles/. How should I create gulp task to watch both these directories and create final .css files somewhere else (say in...

gulp-sass wont import bootstrap installed with bower

gulp,bower,gulp-sass
I want to iterate through all of my bower packages. All of them that have sass files as their main files, I want to include in the includePaths for gulp-sass. I'm using the npm package main-bower-files to successfully get me the main files (and I filter down to just the...

Understand Gulp pipe order

javascript,node.js,gulp,gulp-sass,gulp-preprocess
Context I want to parse some .sass files and replace a variable before compile them into .css. For this I used gulp, gulp-sass and gulp-preprocess: npm install gulp gulp-sass gulp-preprocess --save-dev Gulpfile.js var gulp = require('gulp'); var sass = require('gulp-sass'); var preprocess = require('gulp-preprocess'); var settings = { HOST_URL: 'qa.host.com'...

Sass Sourcemap with Chrome DevTools

google-chrome,source-maps,gulp-sass,gulp-sourcemaps
We are using gulp-sass to compile our SCSS, and using gulp-sourcemaps to generate sourcemaps in our dev environment: ... .pipe(plugins.if(IS_DEV, plugins.sourcemaps.init())) .pipe(plugins.sass({ outputStyle: "nested" })) .pipe(plugins.if(IS_DEV, plugins.sourcemaps.write("./"))) ... Sourcemaps get generated, no issues. When inspecting elements in Chrome DevTools, we can see the source SASS definition, but as soon as...