美文网首页
jade模板引擎的单独使用方法

jade模板引擎的单独使用方法

作者: rill_ | 来源:发表于2017-01-20 16:56 被阅读0次

主要学习jade文件的单独使用方法。

  1. 安装jade模块
  2. 创建jade文件
  3. jade中数据填充
  4. 编译

例子:
创建一个jade-example.jade文件,内容如下:

.header
h1=title
p
.body
    p=body
.footer
    div=By
        a(herf="http://www.baidu.com")=author.name
    ul
        each tag, index in tags
            li=tag

在文件中,主要包含titile:string, body:string,author:string,tags:Array<string>四个数据需要填充。 常用的数据源获取可以从DB,File,User Input等方式获取。如下提供一个数据填充方法。

创建jade-example.js文件用于jade-example.jade文件的数据填充,如下:

var jade = require("jade");
var fs = require("fs");
var data= {
    title:"Test Jade Example",
    author:{
        name:"Rill",
        twitter:"@rill"
    },
    tags:[
        "express",
        "node",
        'javascript'
    ],
    body:process.argv[2]//通过用户输入获取数据
}
//如下提供三种编译方法
fs.readFile('jade-example.jade', 'utf-8', function(err, source){
    //方法1 通过jade。compile
    var tmp = jade.compile(source);
    var html=tmp(data);
    console.log(html);
    // //方法2 通过jade。compile
    // var html = jade.render(source,data);
    // console.log(html);
});

// //方法1 通过jade。compile
// jade.renderFile("jade-example.jade", data, function(err, html){
//     console.log(html);
// })

如上,提供了jade中的三种编译方法,jade.compile(), jade.render(), jade.renderFile()

在命令行中执行node jade-example.js "Test", 查看运行的效果

Paste_Image.png

相关文章

  • jade模板引擎的单独使用方法

    主要学习jade文件的单独使用方法。 安装jade模块 创建jade文件 jade中数据填充 编译 例子:创建一个...

  • Jade

    Jade - 模板引擎 Jade 是一个高性能的模板引擎,它深受 Haml 影响,它是用 JavaScript 实...

  • Express系列(八)

    express之模版引擎jade 一、什么是jade? jade模板引擎相较于原来的html会显得更加简洁,它将标...

  • 2018-12-05 jade

    1jade(模板引擎)使用jade解析字符串下载jade(命令:cnpm install jade/npm ins...

  • Jade学习目录

    第一章 Jade模板引擎课程简介 1-1模板引擎1-2流行的模板1-3课程须1-4Jade环境配置1-5Jade特...

  • 模板引擎

    1.模板引擎:模板引擎编译成html,静态js,css; jade与pug同名 2.如何使用jade解析字符串: ...

  • 模板引擎-jade模板库-1

    模板引擎: jade-破坏式、侵入式、强依赖 ejs-温和、非侵入式、弱依赖性 模板引擎:生成页面 1. jade...

  • NodeJS 模板引擎 ejs&jade

    模板引擎其实就是渲染页面用的,主流的主要有jade和ejs;jade是一个破坏式的模板引擎,侵入式、强依赖;如果用...

  • ✍2019-06-14 关于express

    一、安装express 框架 二、结构 三、配置模板引擎 还别的模板引擎:jade,pug,ejs HTTP的请求...

  • jade模板引擎

    cmd:npm install -g jade 或者 npm install --save-dev ja...

网友评论

      本文标题:jade模板引擎的单独使用方法

      本文链接:https://www.haomeiwen.com/subject/atzwbttx.html