Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

using node-sass with Gulp but getting a top level partial compiled also #215

Closed
sturobson opened this issue Jan 10, 2014 · 12 comments
Closed

Comments

@sturobson
Copy link

I've got a file/folder structure of

| sass | styles.scss
| sass | _variables.scss
| sass | everything-else

in my gulpfile.js I have this task to compile the .scss files into .css

        gulp.task('sass', function (){
            gulp.src('./dev/sass/*.scss')
                .pipe(sass({
                    includePaths: ['./dev/sass']
                }))
                .pipe(prefix(
                    "last 1 version", "> 1%", "ie 8", "ie 7"
                    ))
                .pipe(gulp.dest('./dev/css'))
                .pipe(minifycss())
                .pipe(gulp.dest('./prod/css'));
        });

the includePath does a great job of excluding anything in | sass | everything-else but compiles the _variables.scss file to _variables.css with no content.

I can't fathom how to use the options with node-sass to not compile that file. I don't really want to remove it from the 'top level' of my Sass folder.

I'm sure it's something simple.

For clarity here's my full gulpfile.js - https://gist.github.com/sturobson/8343865

@kennethormandy
Copy link
Contributor

I believe you need to use either data or file along with includePaths, but I might be wrong about that. Here’s how it was done for Harp, if it’s helpful at all. I know having a partial in the root works with that, at least.

@nschonni
Copy link
Contributor

You need to exclude partial files when you use globbing using a !. See grunt-sass for various discussions on the same thing.

@sturobson
Copy link
Author

As per a tweet conversation with @andrew and @neilkinnish - https://twitter.com/teabass/status/421724498103386112 I'm re-opening this

Looking at the specification for Sass over at - http://sass-lang.com/documentation/file.SASS_REFERENCE.html#partials it states -

"If you have a SCSS or Sass file that you want to import but don’t want to compile to a CSS file, you can add an underscore to the beginning of the filename. This will tell Sass not to compile it to a normal CSS file."

So I'd suggest there's something wrong with node-sass / libsass rather than the implementation in gulp/grunt meaning that we shouldn't need to include ! as any _partial.scss shouldn't be compiled into CSS.

Hopefully pinging @hcatlin will firm up what's at fault here too

@nschonni
Copy link
Contributor

The problem is that each file is passed to node-sass, which is why even the Ruby based version has the same problem gruntjs/grunt-contrib-sass#72

@sturobson
Copy link
Author

I find it odd that "even the Ruby based version has the same problem" as I have only noticed it since moving to node-sass using exactly the same file structure.

Irregardless, if the specification from sass-lang is that they don't get compiled. They shouldn't get compiled, right?

update: (obviously my 'works for me' statement in the first sentence is not helpful, apologies)

@nschonni
Copy link
Contributor

Because the globbing is being expanded to individual sass calls, there is no avoiding it.
sass _variables.scss will compile the file even though it is a partial.


😊 Duh, I was actually the on that fixed that in gruntjs/grunt-contrib-sass#72
A similar approach would be required for the Gulp version.

(edit: added emoticon for context of me being forgetful)

@sturobson
Copy link
Author

@nschonni 'Duh' ?

@sturobson
Copy link
Author

"A similar approach would be required for the Gulp version." -
@neilkinnish has done this it seems - dlmanning/gulp-sass#9
update: this pull request is now merged

But I'll bang that drum again -

"if the specification from sass-lang is that they don't get compiled. They shouldn't get compiled, right?"

@nschonni
Copy link
Contributor

Sorry, the "Duh" was directed at myself. I completely forgot that I had patched that in the Ruby and node-sass Grunt plugins.

@nschonni
Copy link
Contributor

"if the specification from sass-lang is that they don't get compiled. They shouldn't get compiled, right?"

Running node-sass someDirWithPartials/*.scss will not compile the partial as per the spec.
Running node-sass someDirWithPartials/_explicitFileName.scss will compile the file.

This behaviour matches the Ruby CLI

@sturobson
Copy link
Author

Ah, right as you say it's down to the the globbing? I guess there's no way to get that to adhere? Or is there something that can be updated in a wiki or similar to save this frustration again?

@nschonni
Copy link
Contributor

Not sure that the instructions belong here since it isn't specific to this implementation, but I agree that it is annoying.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants