style-elements icon indicating copy to clipboard operation
style-elements copied to clipboard

Add CLI - generates css and writes to a file

Open opsb opened this issue 7 years ago • 3 comments

This is a first cut of the cli, with it you can do

style-elements StylesheetModule stylesheetFunction -o my.css

A few questions

  1. Which versions of node do we want to support? (EDIT - now supports node 4+)
  2. Should it be a sub-command? e.g.
style-elements preprocess StylesheetModule stylesheetFunction -o my.css
  1. Any preferences over where to keep the files?

  2. There's a mode option which can be layout (default) or viewport. Can you think of a better name for the option?

A note of thanks to @rtfeldman for elm-css, from which I shamelessly stole lots of this code :)

EDIT: Added (4)

opsb avatar Jul 15 '17 09:07 opsb

Did a little testing with old versions of node. This PR is node 4+ compatible with the exception of the destructuring which is available in node 5 behind a flag and node 6+ by default. I think it's probably worth swapping out the destructuring for broader compatibility.

opsb avatar Jul 15 '17 14:07 opsb

I've swapped in some older style syntax and it now runs against node 4 (tested against node 4.8.4).

opsb avatar Jul 15 '17 14:07 opsb

I've added in the css normalize now, there's a new option called mode which default to layout can be set to viewport e.g.

style-elements StylesheetModule stylesheetFunction -m viewport -o my.css

To allow this I needed to add Element.toLayoutCss and Element.toViewportCss (Element.Internal.Render isn't exported by the library).

opsb avatar Jul 15 '17 16:07 opsb