Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript

Kevin Korte
Kevin Korte
28,109 Points

Gulp JS Error

SOLVED

Something happened when I was setting up my Gulp file, and I just can figure out what.

Gulp Sass was working fine. It was generating my style.css and style.css.map file just fine (this is a Wordpress theme btw). Than I went to import a sass file from one to the other, and that's about the time it started erroring.

So I undid the import, but the error stayed.

Running the default Gulp that has nothing set up works, so I'm pretty sure it has to do with my Sass file set up.

Not sure what else changed. Google or Github wasn't of much help that I could find.

Need a second set of eyes to see if I'm missing something.

Here is the entire gulpfile.

var gulp = require('gulp');
//var rename = require("gulp-rename");
var sass = require('gulp-ruby-sass');

gulp.task('sass', function () {
    return gulp.src('dev/scss/style.scss')
        .pipe(sass({sourcemap: true, sourcemapPath: '../../dev/scss'}))
        .on('error', function (err) { console.log(err.message); })
        .pipe(gulp.dest('/'));
});

gulp.task('default', function() {
  // place code for your default task here
});

And here is what the console shows.

Last good sass import

C:\xampp\htdocs\kevinwordpress\wp-content\themes\mcs>gulp sass
[15:54:39] Using gulpfile C:\xampp\htdocs\kevinwordpress\wp-content\themes\mcs\g
ulpfile.js
[15:54:39] Starting 'sass'...
[15:54:40] gulp-ruby-sass: directory
[15:54:40] gulp-ruby-sass: write style.css
      write style.css.map
[15:54:40] Finished 'sass' after 345 ms

Than I screwed up my Sass import syntax by using parathesis. No biggie right? Easy error and got this message

C:\xampp\htdocs\kevinwordpress\wp-content\themes\mcs>gu
[16:09:42] Using gulpfile C:\xampp\htdocs\kevinwordpres
ulpfile.js
[16:09:42] Starting 'sass'...
[16:09:42] gulp-ruby-sass: directory
error style.scss (Line 5: Invalid CSS after "@import":
string or url()), was "('../../lib/twb...")
[16:09:42] 'sass' errored after 358 ms
[16:09:42] Error: EPERM, open 'C:\style.css'

Fixed the error, even removed the import, and now I get this

C:\xampp\htdocs\kevinwordpress\wp-content\themes\mc
[16:13:11] Using gulpfile C:\xampp\htdocs\kevinword
ulpfile.js
[16:13:11] Starting 'sass'...
[16:13:11] gulp-ruby-sass: directory
[16:13:11] gulp-ruby-sass: write style.css
[16:13:11] gulp-ruby-sass: write style.css.map
[16:13:11] 'sass' errored after 338 ms
[16:13:11] Error: EPERM, open 'C:\style.css'

Best I can tell it's a file permission error. But I'm not sure.

Iago Wandalsen Prates
Iago Wandalsen Prates
21,699 Points

"Running the default Grunt that has nothing set up works, so I'm pretty sure it has to do with my Sass file set up."

You mean gulp?

Kevin Korte
Kevin Korte
28,109 Points

Yes gulp. I'm use to Grunt, but giving Gulp a try for once

I'll edit to reflect correctly. Thanks for the catch!

1 Answer

Kevin Korte
Kevin Korte
28,109 Points

Okay, I got it fixed.

I'm not sure if I went full retard somewhere, but I changed my pipe dist and it's behaving as I want it to now.

This is what I changed to

.pipe(gulp.dest('.'));