「jade」の版間の差分

提供: Node.js/JavaScript入門
移動: 案内検索
(ページの作成:「jadeとは、nodeのテンプレートエンジンです。 '''読み方''' ;jade:じぇいど __TOC__ == 概要 == node.js用のjadeは、高いパ...」)
 
(相違点なし)

2014年9月10日 (水) 01:28時点における最新版

jadeとは、nodeのテンプレートエンジンです。

読み方

jade
じぇいど

概要

node.js用のjadeは、高いパフォーマンスのテンプレートエンジンです。

拡張子

jade用のファイルの拡張子は、 .jade です。

jade用vimプラグイン

vim-jade

vim-jadeは、jadeテンプレート用にシンタックスハイライトを提供します。 .vimrc に以下の設定を追加します。

NeoBundle 'digitaltoad/vim-jade'

NeoBundleを利用して、インストールする場合は、以下のコマンドを実行します。

$ vim +":NeoBundleInstall" +:q

インストール

$ sudo npm install -g jade

jadeコマンドでHTMLファイルを作成する

ソースコード hello.jade

doctype html
html(lang="ja")
        head
                title Page Title
        body
                h1. Header
                        p Hello, World.

実行 hello.htmlの作成

$ jade hello.jade
 
  rendered hello.html

作成された hello.html


 <!DOCTYPE html><html lang="ja"><head><title>Page
 Title</title></head><body><h1>p Hello, World.</h1></body></html>

使い方

コマンドラインオプション

  Usage: jade [options] [dir|file ...]
 
  Options:
 
    -h, --help         output usage information
    -V, --version      output the version number
    -O, --obj <str>    javascript options object
    -o, --out <dir>    output the compiled html to <dir>
    -p, --path <path>  filename used to resolve includes
    -P, --pretty       compile pretty html output
    -c, --client       compile function for client-side runtime.js
    -D, --no-debug     compile without debugging (smaller functions)
    -w, --watch        watch files for changes and automatically re-render
 
  Examples:
 
    # translate jade the templates dir
    $ jade templates
 
    # create {foo,bar}.html
    $ jade {foo,bar}.jade
 
    # jade over stdio
    $ jade < my.jade > my.html
 
    # jade over stdio
    $ echo 'h1 Jade!' | jade
 
    # foo, bar dirs rendering to /tmp
    $ jade foo bar --out /tmp

関連項目