Nodeフロントエンド開発テンプレートエンジンJadeの使い方

今回は、ノードフロントエンド開発テンプレートエンジンJadeの使い方を紹介します。ノードフロントエンド開発テンプレートエンジンJadeを使用する際の

注意事項

は何ですか。以下は実践的なケースです。見てみましょう。 Webの発展に伴い、フロントエンドアプリケーションはますます複雑になり、バックエンドベースの

javascript

(Node.js)も登場し始めています。期待と同時に、JavaScript MVC のアイデアも普及し始めています。ユーザーインターフェースをビジネスデータ（コンテンツ）から分離するために、「テンプレートエンジン」という概念が生まれました。 簡単に言うと、テンプレート エンジンは決定されるいくつかの変数を含む

文字列

であり、データはテンプレート エンジン関数を通じて動的にそれに詰め込まれます。

今日はJadeの使い方と文法の説明についてお話します。 Jade 公式 Web サイト: jade-lang.com/Jade コマンド ライン ツール

インストールが成功したら、Jade の使用は Node 環境に依存する必要があります。 、*.jade という名前のファイル接尾辞を持つ新しいファイルを作成できます。記述した後は、コマンド ライン ツールを使用して、通常使用する HTML 静的ファイルにコンパイルするだけで、jade の構文を思う存分使用できます。

インストール方法

1. まず、Node環境とnpmツールがインストールされているかどうかを確認します:

コマンドラインツールで次のコードを実行します:

node -v
=> v0.10.35
npm -v
=> 1.4.28
// 如果成功返回版本号信息即为已成功安装 Node 环境。

2. Jadeコマンドラインツールをグローバルにインストールします。 npm

rrree

を介して *.Jade ファイルを作成し、タスクを開始します。

4. Jade コマンド ライン ツールを使用して、jade ファイルを HTML ファイルにコンパイルしますJade コマンド ライン ツールの使用方法

jade を通じて Jade コマンド ライン ツールのパラメーターを表示できます。 help

npm install jade -g
// mac用户可能需要管理员权限，使用如下命令
sudo npm install jade -g

例:

jade --help
Usage: jade [options] [dir|file ...]
 Options:
  -h, --help     output usage information / 输出使用信息
  -V, --version   output the version number / 输出版本号信息
  -O, --obj <str>  javascript options object / 传输到 jade 文件中的数据对象
  -o, --out <dir>  output the compiled html to <dir> / 输出编译后的 HTML 到 <dir> 
  -p, --path <path> filename used to resolve includes / 在处理 stdio 时，查找包含文件时的查找路径
  -P, --pretty    compile pretty html output / 格式化编译 html 文件
  -c, --client    compile function for client-side runtime.js / 编译浏览器端可用的 runtime.js
  -n, --name <str>  The name of the compiled template (requires --client) / 编译模板的名字
  -D, --no-debug   compile without debugging (smaller functions) / 关闭编译的调试选项(函数会更小)
  -w, --watch    watch files for changes and automatically re-render / 监听文件改变并自动刷新编译结果
  --name-after-file Name the template after the last section of the file path (requires --client and overriden by --name)
  --doctype <str>  Specify the doctype on the command line (useful if it is not specified by the template) / 在命令行中指定文档类型(如果在模板中没有被指定)
 Examples:
  # 编译整个目录
  $ jade templates
  # 生成 {foo,bar}.html
  $ jade {foo,bar}.jade
  # 在标准IO下使用jade
  $ jade < my.jade > my.html
  # 在标准IO下使用jade
  $ echo 'h1 Jade!' | jade
  # foo, bar 目录渲染到 /tmp
  $ jade foo bar --out /tmp

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨書籍:
ノード フロントエンド テンプレート エンジン Jade タグの使用方法

Vue ドラッグ アンド ドロップ コンポーネントの開発方法

🎜🎜

以上がNodeフロントエンド開発テンプレートエンジンJadeの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。