CODEWITHSUNDEEP
csssassjekyll
dougoftheabaci
dougoftheabaci

Reputation: 704

Make Jekyll process Sass in any directory?

I'm working on a demo site with a bunch of one-off pages. Rather than have them all use the same CSS they'll each have their own stylesheets (with possibly a shared reset). I know I can just put a CSS file into whatever directory and it's fine, but it doesn't seem to work for Sass files.

Is there a way to get Jekyll to process any Sass file regardless of what directory it's in? Or at least in any directory within a certain folder?

Upvotes: 0

Views: 769

Answers (1)

Cameron Hurd
Cameron Hurd

Reputation: 5031

It could be that you don't have any front-matter on your files if they're just in the css/ directory of your project.

Check out an example project here: css/main_css_file.scss, and have a read of this relevant part of the docs entitled "Assets"

Jekyll allows you to customize your Sass conversion in certain ways.

Place all your partials in your sass_dir, which defaults to <source>/_sass. Place your main SCSS or Sass files in the place you want them to be in the output file, such as <source>/css. For an example, take a look at this example site using Sass support in Jekyll.

If you are using Sass @import statements, you’ll need to ensure that your sass_dir is set to the base directory that contains your Sass files. You can do that thusly:

sass:
    sass_dir: _sass

The Sass converter will default the sass_dir configuration option to _sass.

^ You may like to refer to the above if you want to inline the reset for each sheet. <source>/_sass or whatever you configure for sass_dir in the config could be it's home. (Although: you'd probably get a performance boost out of including it separately, so the browser could cache it between requests.)

Upvotes: 3

Related Questions