scss-splinter enables the creation of multiple stylesheets from a common set of modules with minimal effort via SCSS mixins and functions.
scss-splinter accepts an options object that specifies a partial, a base, and a optional keyword to grep for.
constparse=require('scss-splinter');parse({partial: 'src/scss/_brands.scss',base: 'src/scss/_base.scss',keyword: 'split',})Partial is the name of the file that scss-splinter will generate with "split" code, e.g. code that is specified in the matching mixin or sass-function.
Base is the name of the main
sassindex file in a project. This is the file scss-splinter will use to find all the files it needs to parse.
scss-splinter fills the partial file with "split" scss and returns a promise that contains "global" scss. It's up to the project to determine what to do with this global string. One approach would be to run the string through node-sass and write the compiled css to a file.
constfs=require('fs');constparse=require('scss-splinter');constnodeSass=require('node-sass');parse({partial: 'src/scss/_brands.scss',base: 'src/scss/_base.scss',keyword: 'split',}).then((scss)=>{constcompiledGlobal=nodeSass.renderSync({data: scss,});fs.writeFileSync('global.css',compiledGlobal.css.toString());});If your SCSS files are not located at src/scss, you can pass cwd in the params:
constparse=require('scss-splinter');parse({partial: '_brands.scss',base: '_base.scss',keyword: 'split',cwd: 'i/keep/my/scss/files/here',})