三、Jade

index.jade

//cmder

jade index.jade -P

编译后的index.html 文件:

模板的继承
layout.jade文件:
doctype html
head
meta(charset=‘utf-8‘)
body
block desc
p extends from layout
block content

index.jade文件:
extends layout
block content
h2 模板继承

模板的包含
include head

jade核心API
//安装模块
npm install jade coffee-script less markdown --save

Jade was renamed to Pug[红字加粗]

var http = require(‘http‘);
var jade = require(‘jade‘);

http.createServer(function (req, res) {
res.writeHead(200, {‘Content-Type‘: ‘text/html‘});

//1. compile
//var fn = jade.compile(‘div #{course}‘, {});
//var html = fn({course: ‘jade‘});

//2.jade.render
//var html = jade.render(‘div #{course}‘, {course: ‘jade render‘});

//3.jade.renderFile
//pretty: true 意思是格式化
var html = jade.renderFile(‘index.jade‘, {course: ‘jade renderFile‘, pretty: true});

res.end(html);
}).listen(1337, ‘127.0.0.1‘);

console.log(‘server running as 1337‘);

时间: 2024-08-05 01:58:12

三、Jade的相关文章

学习前端模板引擎 jade (一)

一.为什么要学习jade? 通常大部分前端开发工作者一开始步入前端开发的时候,都是直接简单的写html页面然后丢给后台开发,后台开发在来嵌入模版. 对于日益庞大的前端页面来说,还是用老的字符串拼接的方法来嵌入html内容已经不适应当下的开发趋势了. 废话不多说,直接切入正题. 二.开始装jade. jade基于nodejs的开发环境,所以我们首先要安装nodejs,nodejs的安装方法其实还是挺复杂的,所以请大家自己去百度或者google,省事可以直接去nodejs的官方网站下载nodejs的

模板引擎之-jade

##### 首先我们安装jade模板引擎并编译`npm install jade --global`在项目文件夹下创建一个`index.jade`文件,并且写入```doctypehtml head title imooc jade study body h1 imooc jade study ```然后在命令行下执行`jade -P index.jade `参数大写P表示格式化的编译jade文件.##### 一.基础篇1.标签直接写一个标签名就可以了,标签里面的内容只需要在标签后空一个格写文本

nodejs+express+jade配置

安装步骤 一.首先可跟着这个网址安装http://jingyan.baidu.com/article/91f5db1b2bb6941c7f05e33c.html,路径可由自己定. 二.同时参考http://www.cnblogs.com/pigtail/archive/2013/01/08/2850486.html 三.以上两个链接的参考见下 1.安装nodejs,比如安装在E:\program files\nodejs(这是本人的安装路径). 确保有两个环境变量 用户环境变量:C:\Users

ROS学习(三)—— ROS文件系统

一.预备工作 使用ros0tutorials程序包,先下载: sudo apt-get install ros-<distro>-ros-tutorials 其中<distro>应该需要替换成ROS的对应版本:Jade.Indigo.hydro.groovy.fuerte.kinetic p { margin-bottom: 0.25cm; line-height: 120% } a:link { } 二.文件系统概念: 三.文件系统工具 1.rospack = ros + pac

jade学习

jade安装? nodeJs中输入以下命令 sudu npm install jade -g jade -h jade工具 推荐:online official online html2jade jade语法 标签 以p标签为例 p 会转换为: <p></p> jade能自动识别自闭和标签: input 会转换为: <input/> 文本 标签中添加文本 p 欢迎加入wandoujia-fe 会转换为: <p>欢迎加入wandoujia-fe</p&g

[js高手之路]Node.js模板引擎教程-jade速学与实战1

环境准备: 全局安装jade: npm install jade -g 初始化项目package.json: npm init --yes 安装完成之后,可以使用 jade --help 查看jade的命令行用法 一.在项目目录下新建index.jade文件 inde.jade代码: 1 doctype html 2 html 3 head 4 meta(charset='utf-8') 5 title 6 body 7 h3 欢迎学习jade 语法规则: 1, 标签按照html的缩进格式写 2

Node.js笔记(三)路由和socket.io

本文参考了<Node应用程序构建--使用MongoDB和backbone>的第二章 -------------------------------- 路由 依赖于ConnectHTTP服务器框架,Express提供了视图渲染和一种描述路由的语言 要使用express,首先要安装express,安装过程不再描述, 看下面一段示例代码: var express = require('express'); var app = express(); app.get('/stooges/:name?',

Jade教程

Jade 是一个高性能的模板引擎,它深受 Haml 影响,它是用 JavaScript 实现的,并且可以供 Node 使用. 如何写前端js代码 script(type='text/javascript'). $(document).ready(function () { alert('马良设计'); }) 请注意后面有个. 引用前端的js文件 script(src='/javascripts/jquery-1.10.2.js') 如何写前端css代码 引用css样式 link(rel='sty

Node.js开发入门—使用jade模板引擎

在"Node.js开发入门--Express安装与使用"里,我们曾经使用express generator创建了一个HelloExpress网站,express工具为我们生成了基本的目录结构.模板.stylesheet.routers等.虽然那只是一个简单的HelloWorld类的小东西,可里面包含的内容还是有些多了,为了更好的理解Express所支持的jade模板引擎的用法,我们这次提供一个手动创建的小网站,可以显示来访者的IP,并对访问进行计数. 安装jade npm instal