更多功能可去github查看下载
首先要安装几个扩展这里不讲怎么装了。
文件结构如下:
一定要注意路径
server.js
'user strict'
var port = 8888;
const express = require('express'),
app = express(),
bodyParser = require('body-parser'),
path = require('path'),
fs = require('fs');;
app.set('views','./static/pages');
app.set('view engine', 'jade');
app.use(express.static(path.join(__dirname,'./static')));
app.get('/image', function (req, res) {
var files =fs.readdirSync('./static/images');
res.render('index',{
title:'标题' ,
contentTitle: 'Hello World',
imgs:files,
description:'我的图片'
})
});
app.get('*', function(req, res){
res.render('404',{})
});
var server = app.listen(port, function () {
var host = server.address().address;
var port = server.address().port;
console.log("网址访问路径 http://%s:%s", host, port);
});
注意语句 block content
layout.jade
doctype
html
head
meta(charset='utf-8')
title #{title}
include ./head
body
block content
head.jade
link(href="/css/main.css" rel='stylesheet')
index.jade
extends ../layout
block content
h1 #{contentTitle}
p #{description}
each img in imgs
img(src="images/#{img}" class="row-img")
(可以加一个放js的地方,与css类似,此处不多说啦。)
main.css
h1 {
color: red;
}
.row-img {
width:140px;
height:140px;
margin:5px
}
代码写完了,命令行进入项目server.js 所在目录
node server.js
打开浏览器查看
http://127.0.0.1:8888/image