Using Different Compilers

While roots' default template uses jade, stylus, and coffeescript, roots supports a large variety of different compiled languages that are extremely easy to get started with.

Roots uses a project called accord to compile files. In order to use a language, you just need to install the package using npm, then create a file using that language's file extension. Below is a list of supported languages along with their package names and extensions:

• jade: npm i jade -S, *.jade
• eco: npm i eco -S, *.eco
• ejs: npm i ejs -S, *.ejs
• markdown: npm i marked -S, *.md
• mustache: npm i hogan.js -S, *.mustache or *.hogan
• handlebars: npm i handlebars -S, *.hbs
• haml: npm i hamljs -S, *.haml
• swig: npm i swig -S, *.swig
• marc: npm i marc -S, *.md
• toffee: npm i toffee -S, *.toffee
• dot: npm i dot -S, *.dot
• stylus: npm i stylus -S, *.styl
• scss: npm i node-sass -S, *.scss or *.sass
• less: npm i less -S, *.less
• myth: npm i myth -S, *.myth
• postcss: npm i postcss -S, *.css or *.pcss or *.sss
• coffee-script: npm i coffee-script -S, *.coffee
• dogescript: npm i dogescript -S, *.djs
• coco: npm i coco -S, *.co
• LiveScript: npm i LiveScript -S, *.ls
• babel: npm i babel-core -S, *.js or *.jsx
• jsx: npm i react-tools -S, *.jsx
• cjsx: npm i coffee-react-transform -S, *.cjsx
• typescript: npm i typescript-compiler -S, *.ts
• minify-js: npm i uglify-js -S, *.js
• minify-css: npm i clean-css -S, *.css
• minify-html: npm i html-minifier -S, *.html
• csso: npm i csso -S, *.css
• escape-html: npm i he -S, *.html

So for example if you wanted to use ejs, you could just run npm i ejs -S from your command line, then create a file with a .ejs extension, and the next time you run roots, it will compile.

If you want to pass options to any of these compilers, you can do so using app.coffee. Simple add the name of the compiler as a key to your configuration, and as the value, an object with any of the configuration values. Each language's options are documented here.

Note that multiple languages can be used with multipass compilation. This means that as long as the languages are compatible, you can put two extensions on a file and have it compiled through both languages. For example, if you wanted to run both jade and minify-html, you could name the file example.html.jade, install both compilers, set up the options as you wish, and it will run.