derby-jade

Jade static compiler for Derby.js

Jade fork for derby.js templates compilation (not the actual Derby.js template engine).

Jade documentation

Supports derby-specific tags that ends with : and makes if, else, else if, unless, with, each compile into derby View-variables.

Usage

Right after creating your Derby app, add:

// Add Jade compilation support
app.serverUse(module, 'derby-jade');

Make sure this is before any calls to app.loadViews().

Coffeescript

If you want to use Coffeescript instead of Javascript in templates:

// Add Jade compilation support
app.serverUse(module, 'derby-jade', {coffee: true});

Then you can do something like this:

if a and b
  p 
    a(on-click="console.log c or 'log'") {{d or 'Click Me'}}

Derby.js-specific syntax

Conditionals, each, with

if _session.loggedIn
  h1 Hello, {{_session.username}}
else
  a(href='/login') Login

compiles to

{{if _session.loggedIn}}
    <h1>Hello, {{_session.username}}</h1>
{{else}}
    <a href="/login">Login</a>
{{/}}

Another example:

if _page.flash as #flash
  if #flash.error
    ul.alert.alert-error
      each #flash.error
        li {{this.error}}
  if #flash.info
    ul.alert.alert-success
      each #flash.info as #info
        li {{#info}}
else
  p No notifications

compiles to

{{if _page.flash as #flash}}
    {{if #flash.error}}
        <ul class="alert alert-error">
            {{each #flash.error}}
                <li>{{this.error}}</li>
            {{/}}
        </ul>
    {{/}}
    {{if #flash.info}}
        <ul class="alert alert-success">
            {{#each #flash.info as #info}}
                <li>{{#info}}</li>
            {{/}}
        </ul>
    {{/}}
{{else}}
    <p>No notifications</p>
{{/}}

import: and template declarations

import:(src='./auth', ns='')
import:(src='./games')

Title:
  | My cool app

Body:
  view(name='welcome', title='Welcome {{_session.username}}')
    p We are glad to see you!

Footer:
  view(name='copyright')

welcome:
  h1 {{@title}}
  | {{@content}}

copyright:
  p Use it however you want {{_session.username}}!

Installation

$ cd /path/to/project/
$ npm install git://github.com/cray0000/derby-jade.git --save-dev

Can be used in conjunction with task-runners like grunt-contrib-jade or directly by calling for example:

$ ./node_modules/.bin/jade -w ./jade/ --out ./views/**/

Screenshot