CODEWITHSUNDEEP
csssass
SkinnyG33k
SkinnyG33k

Reputation: 1731

Syntax to include separate Sass file?

I can't confirm that this syntax is best practice. I would like to reference an external Sass file and have it prepend it to my final CSS file, this way my Sass sheet looks more clean, and I'm only still only making one HTTP request.

For example, take the "normalize" code and put it into a .sass file, then in my sass sheets simply refer to it:

@import src/normalize
@import src/droidSans

rest of code here.....

It works fine so far, but I can't find anything concrete if I'm headed in the right direction. Also I am just making static templates for the time being... not using Rails at the moment.

I have been playing around with Sass for a few hours and I love it!!!

Upvotes: 45

Views: 51073

Answers (1)

Sampson
Sampson

Reputation: 268512

In order to prevent your partial from being converted into its own css file, prefix the filename with an underscore, _normalize.scss. Then you can import it the way you've indicated you're doing already:

@import "normalize";

Or import many files at once:

@import "normalize", "droidSans";

Or import from a relative directory:

@import "folder/file"

Note the use of double-quotes and semi-colon; I'm using the SCSS syntax which is a later development to the SASS word. While both styles are valid, you may find yourself preferring one over the other depending on what other languages you dabble in.

Further reading can be found under Directives/Partials in the documentation.

Upvotes: 97

Related Questions