Using Gulp Sass, Upload External Changes not working on compiled CSS.

I have "Automatically upload to remote server" and "Upload external changes" both ON. I am using Gulp to watch and compile my Sass files. The upload does not work unless I lose focus of PhpStorm and then re-focus. Please help!!!!!

 

Here is a copy/paste of my gulpfile.js

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

var paths = {
styles: {
src: './css/src',
files: './css/src/**/*.scss',
dest: './css'
}
};

var displayError = function(error) {
var errorString = '[' + error.plugin + ']';
errorString += ' ' + error.message.replace("\n",'');
if(error.fileName)
errorString += ' in ' + error.fileName;
if(error.lineNumber)
errorString += ' on line ' + error.lineNumber;
console.error(errorString);
};

gulp.task('sass', function (){
gulp.src(paths.styles.files)
.pipe(sass({
outputStyle: 'compressed',
sourceComments: 'map',
includePaths : [paths.styles.src]
}))
.on('error', function(err){
displayError(err);
})
.pipe(prefix(
'last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'
))
.pipe(gulp.dest(paths.styles.dest))
});

gulp.task('default', ['sass'], function() {
gulp.watch(paths.styles.files, ['sass'])
.on('change', function(evt) {
console.log(
'[watcher] File ' + evt.path.replace(/.*(?=sass)/,'') + ' was ' + evt.type + ', compiling...'
);
});
});
0
3 comments

What version are you running? There was a similar issue in 2016.3 builds - it should work much more reliably in version 2017.1.

0
Avatar
Permanently deleted user

Hi, I have the same issue.

I use PHPStorm 2017.3.3

 Can we trigger the PHPStorm "scan for changed files" function inside the gulp process?
Is there any workaround or fix for it?

0

No fix currently. Please vote: https://youtrack.jetbrains.com/issue/WEB-25532
You can use File | Synchronize to force files scanning as a workaround.

0

Please sign in to leave a comment.