metalsmith-with-postcss
v1.1.0
Published
A Metalsmith plugin for PostCSS.
Downloads
7
Maintainers
Readme
Metalsmith with PostCSS
A Metalsmith plugin for PostCSS.
Explanation
Use PostCSS and PostCSS plugins with Metalsmith.
You mustn't forget to install the PostCSS plugins with npm install
first.
Install
npm install metalsmith-with-postcss --save
Example
metalsmith.json config example:
{
"plugins": {
"metalsmith-with-postcss": {
pattern: ['**/*.css', '!**/_*/*', '!**/_*'], //This is the default.
plugins: {
'postcss-import': {},
'postcss-if-media': {},
'postcss-custom-media': {},
'postcss-media-minmax': {},
'postcss-layout': {},
'postcss-aspect-ratio': {},
'autoprefixer': {}
}
}
}
}
Build script example:
var metalsmith = require('metalsmith');
var markdown = require('metalsmith-markdown');
var postcss = require('metalsmith-with-postcss');
var sugarss = require('sugarss');
var rename = require('metalsmith-rename';
metalsmith(__dirname)
.source('src')
.destination('pub')
.use(postcss({
pattern: ['**/*.sss', '!**/_*/*', '!**/_*'], //For SugarSS,
parser: sugarss,
plugins: {
'postcss-import': {},
'postcss-if-media': {},
'postcss-custom-media': {},
'postcss-media-minmax': {},
'postcss-layout': {},
'postcss-aspect-ratio': {},
'autoprefixer': {}
}
}))
.use(rename([[/\.sss$/, '.css']])) //Renames processed files to CSS
.use(markdown({
gfm: true,
tables: true
}))
.build(function (err) {
if (err) {
throw err;
}
});
Options
pattern
- Default value:
['**/*.css', '!**/_*/*', '!**/_*']
- Description: Only process files that match this pattern, can be an array of multiple patterns, following multimatch rules. The default patterns exclude any files or folders prefixed with an underscore.
- Default value:
parser
- Default value: undefined
- Description: A custom parser module passed directly to PostCSS.
stringifier
- Default value: undefined
- Description: A custom stringifier module passed directly to PostCSS.
syntax
- Default value: undefined
- Description: A shorthand object for the parser and stringifier passed directly to PostCSS.
plugins
- Default value: {}
- Description: A collection of plugin module names as keys and any options for them as values.
map
- Default value: {inline: true}
- Description: Source mapping options passed directly to PostCSS.
removeExcluded
- Default value: false
- Description: If
true
remove the files from metalsmith that were excluded by thepattern
, so they won't appear in your build directory.