postcss / sugarss

Indent-based CSS syntax for PostCSS
MIT License
708 stars 39 forks source link

[Help] Using sugarss with node? #67

Closed oleersoy closed 5 years ago

oleersoy commented 5 years ago

I'm trying to run the following test:

fs.readFile('red.sss', 'utf-8', (err, css)=>{
    console.log(css);
    postcss([autoprefixer], { syntax: sugarss })
      .process(css, { from: './red.sss', to: './app.css' })
      .then(result => {
        fs.writeFile('./app.css', result.css, () => true)
        if ( result.map ) {
          fs.writeFile('./app.css.map', result.map, () => true)
        }
      })
});

And it errors with:

/home/ole/te/node_modules/postcss/lib/processor.js:168
        throw new Error(i + ' is not a PostCSS plugin');
        ^

Error: function creator() {
    var transformer = initializer.apply(void 0, arguments);
    transformer.postcssPlugin = name;
    transformer.postcssVersion = new _processor.default().version;
    return transformer;
  } is not a PostCSS plugin
    at Processor.normalize (/home/ole/te/node_modules/postcss/lib/processor.js:168:15)
    at new Processor (/home/ole/te/node_modules/postcss/lib/processor.js:52:25)
    at postcss (/home/ole/te/node_modules/postcss/lib/postcss.js:55:10)
    at fs.readFile (/home/ole/te/index.js:8:5)
    at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:53:3)
ole@mki:~/te$ 

I used the gulp example to create the line:

    postcss([autoprefixer], { syntax: sugarss })

Is this the right way to apply sugarss when using node?

ai commented 5 years ago
postcss([autoprefixer]).process(sss, { parser: sugarcss, from, to })
  1. You need to pass sugarss to process()
  2. syntax: sugarss compiles SugarSS to SugarSS (it is useful, for example, to sort properties in SugarSS sources). Use parser: sugarss to compile SugarSS to CSS.
oleersoy commented 5 years ago

Awesome - I did a quick write up here in case anyone else comes across the same issue: https://medium.com/@ole.ersoy/processing-sugarss-with-node-b54993359a32 Thanks!

ai commented 5 years ago

Wow, good idea.