❤
npm
Sign UpSign In

budo-less

1.0.1 • Public • Published

budo-less

experimental

Experiments with LESS and budo. For a custom dev script, e.g. using PostCSS or SASS, see API Example.

Install

npm install budo-less -g

For pretty printing, you can pipe to garnish.

Example

budo-less src/index.js:bundle.js --live --less style.less | garnish

Now, when you hit http://localhost:9966/, the default HTML index will look like this:

<!doctype html>
<head>
  <title>hello</title>
  <meta charset="utf-8">
  <link rel="stylesheet" href="style.css">
</head>
<body>
  <script src="bundle.js"></script> 
</body>
</html>

When the server requests style.css, it will pre-process your specified --less file on the fly, writing CSS to the response.

When you make changes to .less files in your working directory, it will trigger a CSS LiveReload without refreshing the page.

Usage

The CLI behaves like budo, with the following extra options:

Usage:
  budo-less [opts] -- [browserifyOpts]
 
Options:
  --live        enable LiveReload for HTML/LESS
  --less        path to your LESS entry point
  --css         optional URL for the CSS href
  --paths       optional list of paths for LESS (colon-delimited in unix)
  --autoprefix  optional; enable autoprefix for given browsers

The --css flag defaults to the filename of --less.

Examples:

budo-less foo.js --less=foo/main.less | garnish
budo-less foo.js --css=static/main.css --less=src/main.less
budo-less foo.js --less=main.css --autoprefix="last 2 browsers"

API Example

This is fairly simple to achieve using the budo API.

See test/api-example.js for an example of this.

License

MIT, see LICENSE.md for details.

Readme

Keywords

Package Sidebar

Install

npm i budo-less

Repository

github.com/mattdesl/budo-less

Homepage

github.com/mattdesl/budo-less

Weekly Downloads

2

Version

1.0.1

License

MIT

Last publish

Collaborators

  • mattdesl
Try on RunKit
Report malware