Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: plugins
Fetching contributors…

Cannot retrieve contributors at this time

94 lines (70 sloc) 3.003 kb


CoffeeMugg is a templating engine for node.js and browsers that lets you to write your HTML templates in 100% pure CoffeeScript.

CoffeeMugg is a branch of CoffeeKup. The main difference is that instead of local tag functions, tag functions are bound to this.

Why CoffeeMugg?

  • No magic compilation step: the template code runs as you would expect.
  • Local variables obey original Javascript/Coffeescript rules.
  • If you want to create a template dynamically using function closures, you can!
  • This makes it easier to create libraries of view-helper routines, in the manner of RoR ActionView.


Basic example:

cm = require 'coffeemugg'

cm.render ->
  @div ->
    @p "I am a paragraph"
    @raw "<p> This is unescaped, raw HTML </p>"
    @text "<< This will be escaped ! >>"

Custom TAG functions (subroutines)

You can add custom @TAG functions to CoffeeMugg with 'plugins'.

# Install custom tags! In this case, just the tag '@showFruits'
cm.install_plugin ->

  # The tag 'showFruits' will become available everywhere.
  # It is a regular function, so it can take arguments too, like 'fruits'
  @showFruits = (fruits) ->
    @ul ->
      for fruit in fruits
        @li fruit

# Here is the main template function.
# Notice that the main template function can also take javascript arguments.
template = (fruits) ->
  @div ->
    # Pass in 'fruits' to our custom '@showFruits' tag
    @showFruits fruits

# Options to CoffeeMugg
#   autoescape: The "text" values are automatically HTML escaped.
#               You can still use the '@raw' tag for unescaped text.
#               Default: yes
#   format:     The output HTML will be formatted all pretty.
#               Default: yes
options = {
  autoescape: yes
  format:     yes
fruits  = ['Apple', 'Banana', 'Raisin', 'Rice Crispies', 'Mickey Mouse']
cm.render template, options, fruits


npm install coffeemugg


Create static html files in CoffeeMugg syntax. It's adapted from coffeecup.

coffeemugg -h

  coffeemugg [options] path/to/

  -w, --watch        watch templates for changes, and recompile
  -o, --output       set the directory for compiled html
  -p, --print        print the compiled html to stdout, don't write file
  -f, --format       apply line breaks and indentation to html output
  -v, --version      display coffeemugg version
  -h, --help         display this help message


Please take a look at the excellent CoffeeScript documentation for more information.

Special thanks

Jump to Line
Something went wrong with that request. Please try again.