How to render jade templates into HTML using brunch

Question

Trying to use brunch for my new project. One thing I want to do is being able to write all my HTML assets in jade and have brunch render it into HTML during the build. I found the jaded-brunch, but I cannot seem to figure out how to make it do what I want. Here is my config.

exports.config =
    paths:
        watched: ['client']

    npm:
        enabled: true
        packages: ['react']

    plugins:
        jaded:
            jade:
                pretty: yes
    files:
        javascripts:
            joinTo:
                'js/app.js': /^app/
                'js/vendor.js': /^(?!app)/
        stylesheets:
            joinTo: 'css/app.css'

    templates:
        joinTo: 'index.html'

Answer 1

Per the jaded-brunch documentation, you can tell it to compile jade files into static html output either by naming them all with a .static.jade file extension, or set the staticPatterns option, like:

plugins:
    jaded:
        staticPatterns: /\.jade$/
        jade:
            pretty: yes

Answer 2

This is an old question, but Brunch has been updated to handle static asset compilation a bit more gracefully.

The official jade-brunch package takes care of business with no additional config.

Placing your .jade files in your app/assets directory (or wherever you've set your static basedir to) compiles the jade files as static HTML.

If you're using includes/extends and you don't want a bunch of partial HTML files in your public directory, naming them with a preceding underscore tells Brunch to ignore those files. If your app directory looks like this:

app
  | assets
  |  | index.jade
  |  | partials
  |  |   | _header.jade

...and your index.jade includes _header:

include partials/_header

your public directory will look like this:

public
  | index.html

Works great.