title: Jade template as a preprocessor for html
body: <p>I will not be using <a href="http://nodejs.org/" rel="noreferrer">node.js</a> in production, but I like <a href="http://jade-lang.com/" rel="noreferrer">jade</a>s syntax, so I would like to compile <a href="http://jade-lang.com/" rel="noreferrer">jade</a> template into <code>html</code> when developing.</p>
  
  <p>Given this file structure:</p>
  
  <pre><code>app/
    jade_templates /
      index.jade
      subfolder /
        subpage.jade
    html_templates /
      index.html
      subfolder /
        subpage.html
  </code></pre>
  
  <p>I would like to have a <em>script</em> that watches the <code>jade_templates</code> directory and compiles the corresponding html template to <code>html_templates</code> any time a change has been made.</p>
  
  <p>How can this be accomplished?</p>
  
  <p>Thank you.</p>
  
  <p><strong>EDIT</strong>
  The Jade <a href="https://github.com/visionmedia/jade#readme" rel="noreferrer">README</a> has this Sample Makefile, but I'm not sure how to adapt this to my needs.</p>
  
  <pre><code>JADE = $(shell find pages/*.jade)
  HTML = $(JADE:.jade=.html)
  
  all: $(HTML)
  
  %.html: %.jade
      jade &lt; $&lt; --path $&lt; &gt; $@
  
  clean:
      rm -f $(HTML)
  
  .PHONY: clean
  </code></pre>