hexo-renderer-yasr

Yet Another Stylus Renderer

A Stylus renderer for Hexo that uses Nib, Axis, Rupture, Jeet, Typographic, and Autoprefixer.

Now with sourcemaps

Although Hexo does come with it's own Stylus renderer — hexo-renderer-stylus — it only includes Nib support. If you're looking for some extra functionality, hexo-renderer-yasr is the stylus renderer you want.

Installation

Check to see if you have installed hexo-renderer-stylus (check inside the node-modules directory, but don't delete it.). If you have it installed run:

$ npm uninstall hexo-renderer-stylus --save

After you've removed the default renderer, or if you never installed it in the first place, run:

$ npm i hexo-renderer-yasr --save

Configuration

Place the following code inside your _config.yml.

# YASR Configuration
## Docs: https://github.com/celsomiranda/hexo-renderer-yasr
yasr:
  axis: true              # Enables Axis (Recommends Nib)
  compress: false         # Disables Compression
  jeet: true              # Enables Jeet
  nib: true               # Enables Nib
  rupture: true           # Enables Rupture
  typographic: true       # Enables Typographic
  autoprefixer:           # Autoprefixer-stylus configuration
    browsers:
      - 'last 2 version'
      - '> 5%'
  sourcemaps:             # Sourcemaps configuration
    comment: true
    inline: true
    sourceRoot: ''
    basePath: 'css/'

• Sourcemaps

  • comment - Adds a comment with the sourceMappingURL to the generated CSS (default: true)
  • inline - Inlines the sourcemap with full source text in base64 format (default: false)
  • sourceRoot - sourceRoot property of the generated sourcemap
  • basePath - Base path from which sourcemap and all sources are relative (default: .)

• Autoprefixer

  • browsers - An array that defines which browsers should be considered by autoprefixer