- Notifications
You must be signed in to change notification settings - Fork99
Adds Sass / Scss support to brunch
License
brunch/sass-brunch
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Adds Sass support toBrunch.
Install the plugin via npm withnpm install -S sass-brunch.
Set additional include paths:
includePaths:['node_modules/foundation/scss']
Usecustom functions (only synchronous functions are supported):
vartypes=require('sass').typesmodule.exports={plugins:{sass:{functions:{'example($foo, $bar)':function(foo,bar){returnnewtypes.String("I'm an example")}}}}}
Starting Brunch2.6.0, you can use CSS Modules with css-brunch. To enable it, change your config to:
module.exports={// ...plugins:{sass:{modules:true}}};
You can also pass options directly topostcss-modules:
generateScopedName:'[name]__[local]___[hash:base64:5]'Then, author your styles like you normally would:
.title {font-size:32px;}
And reference CSS class names by requiring the specific style into your #"auto" data-snippet-clipboard-copy-content="var style = require('./title.scss');<h1 className={style.title}>Yo</h1>">
varstyle=require('./title.scss');<h1className={style.title}>Yo</h1>
Note: enablingcssModules does so for every stylesheet in your project, even the files you don't require will be transformed into CSS modules (aka will have obfuscated class names, like turn.title into._title_fdphn_1).
You must use the ignore option to specifically opt out of files or directories where you don't want to use cssModules.
The ignore option takes an array of matches.Anymatch is used to handle the matching. See theanymatch documentation for more information.
module.exports={// ...plugins:{sass:{modules:{ignore:[/file\.css/,/some\/path\/to\/ignore/]}}}};
The MIT License (MIT)
About
Adds Sass / Scss support to brunch