Skip to content
simple, fun, static-file builder for jade, stylus, and javascript
Find file
New pull request
Pull request Compare This branch is 27 commits behind master.
Fetching latest commit...
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Simple static-file build system for jade, stylus, and JavaScript.

  • Express plugin for easily rendering built-or-debug HTML, CSS, and JS.
  • Command-line mason executable for easily building projects.
  • JavaScript API for building from within your own code.


You have a dozen site-wide platform dependencies that you want to package in platform.js. You have per-page JS assets that you want to package in page-name.js files. During development, you need all of these assets to be included as separate, uncompiled files with line numbers. During production, you need to flip a switch to minify all these files and include them in the right places. You want to easily generate static html and css from jade and stylus.

Install mason

  $ npm install -g mason

or use package.json's devDependencies:


Build static files

use the settings in mason.json:

  $ mason build

or using devDependencies:

  $ node_modules/.bin/mason build

Watch your files

  $ mason watch

(mason is smart about recompiling - it performs the minimum possible build for each file change)

  $ mason watch -j debug

Render a mason asset within a view

!!! 5
    != mason('platform.js')

By default, mason build injects compressed (uglified) script tags via the != mason() local.

To inject individual scripts for debugging, use:

  $ mason build -j debug


base: Tells where to put your compiled files

src: Used by mason.locals() to render URLs (eg, /compiled/platform.js instead of /work/project/public/compiled/platform.js)

renderer: Specify the default renderer for this asset

javascript:" Specify the default renderer for this type of asset

  "javascript": "debug",

  "platform.js": {
    "type": "javascript",
    "source": {
      "base": "public",
      "src": [
    "dest": {
      "base": "public",
      "src": "compiled/platform.js"
    "renderer": "uglify"

  "page.js": {
    "type": "javascript",
    "source": {
      "base": "public",
      "src": [
    "dest": {
      "base": "public",
      "src": "compiled/page.js"

  "global.css": {
    "type": "stylus",
    "source": "styles/global.styl",
    "dest": {
      "base": "public",
      "src": "compiled/global.css"

  "test.html": {
    "type": "jade",
    "source": "views/test.jade",
    "dest": {
      "base": "public",
      "src": "test.html"

JavaScript API

Build static files

  var mason = require('mason');, {
    'page.js': 'uglify'

(mason.json resides in __dirname)

Use mason in an express app

  var app = express();

By default, mason.locals will inject a compressed (uglified) script into your view.

To control how specific assets are injected, use:

  var app = express(),
      config = {
        'platform.js': 'uglify',
        'page.js': 'debug'
  app.locals(mason.locals(__dirname, config));
Something went wrong with that request. Please try again.