Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

frets-styles-generator

Package Overview
Dependencies
Maintainers
1
Versions
33
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

frets-styles-generator

Tool that genreates a typescript class for FRETS based on a CSS file

  • 0.2.0
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
3
decreased by-70%
Maintainers
1
Weekly downloads
 
Created
Source

frets-styles-generator

Genreates a typescript class from a given input css file. The typescript

Uses postcss under the hood.

Installation

npm install frets-styles-generator --save-dev

Usage

node node_modules/.bin/frets-styles-generator

The first argument you pass to the program will be the directory to scan for CSS files. It defaults to "./src" if you leave the argument out. Each CSS file that is found will be run through postcss (utilizing the postcss-import plugin by default) and then turned into a .ts file like [orginialFilename-styles.ts] based on the template specified. The default template is for maquette hyperscript functions.

Optionally pass this argument -t '[path to custom template.js file]' to specify a custom template.

Includes an optional watch flag -w.

Includes an options flag -o which will overwrite the original css file using the postcss-import plugin.

Used in conjunction with FRETS and/or another hyperscript implementation. This particular template is specifically for the Maquette hyperscript implementation. Meaning it outputs a ts file that expects maquette to be available for import, so you will need 'maquette' in your project as a dependency.

I find it especially useful for rapid prototyping if you point it at BaseCSS or tachyons because then you have a chainable typescript method for every "atomic" css class.

Custom Templates

See the current maquette template for an example.

Keywords

FAQs

Package last updated on 23 Jan 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc