Express_01--Express中的基本常识和模板引擎的用法-阿里云开发者社区

Express_01--Express中的基本常识和模板引擎的用法

2021-11-16 118

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： Express_01--Express中的基本常识和模板引擎的用法

这是我参与8月更文挑战的第9天，活动详情查看：8月更文挑战

1. 安装express

npm i express
复制代码

2. Express的Hello,World

const express = require('express');
const app = express();
app.get('/',(req,res) => {
    res.send('Hello,Express!');
})
app.listen(3000,() => {
    console.log('服务器启动成功！');
})
复制代码

3. 将一个文件夹下的所有文件变为可访问

app.use('/public',express.static('./public'));
复制代码

4. 使用nodemon来保存后自动重启

npm install nodemon -g
复制代码

以后启动一个文件不再使用node + 文件名的方式，而是使用nodemon + 文件名的方式。这样可以实现热更新，即保存就更新服务器。

基本路由

app.get('/',(req,res) => {
    res.send('Hello,Express666!');
})
app.get('/about',(req,res) => {
    res.send('关于');
})
复制代码

暴露文件不同方式的区别

1. 只有一个参数（URL可以直接访问文件名）

app.use(express.static('./public'));
复制代码

2. 两个参数（URL必须包含指向改文件的路径）

app.use('/public',express.static('./public'));
复制代码

3. 别名的形式

app.use('/a',express.static('./public'));
复制代码

这里的a意思是路径中以a开头的，就可以访问public路径下的文件。

在express中配置模板引擎art-template

1. 安装art-template

npm install --save art-template
npm install --save express-art-template
复制代码

2. API介绍

当渲染以.art结尾的文件的时候，使用art-template模板引擎

app.engine('art', require('express-art-template'));
//或者，下面的这种方式也是可以的
app.engine('html', require('express-art-template'));
复制代码

调用res.render的时候，会默认去项目的views目录中查找指定的文件，但是该文件必须以art结尾。如果engine中的第一个参数是html，则不需要进行重命名，即下面的第二种方式。

app.get('/',(req,res) => {
    res.render('404.art');
})
// 方式二
app.get('/',(req,res) => {
    res.render('404.html');
})
复制代码

修改默认的views目录

app.set('views','test');
复制代码

一个基于express的留言本小案例

const express = require('express');
const app = express();
let comments = [
    {
        name: '黄多多',
        message: '爸爸去哪了',
        dateTime: '2020-5-21'
    },
]
app.engine('html', require('express-art-template'));
app.get('/', (req, res) => {
    res.render('index.html',{
        comments
    });
})
app.get('/post', (req, res) => {
    res.render('post.html');
})
app.get('/pinglun',(req,res) => {
    let comment = req.query;
    comment.dateTime = new Date().toLocaleString();
    comments.unshift(comment);
    res.redirect('/');
})
// 开放public目录
app.use('/public', express.static('public'));
app.listen(3000, () => {
    console.log('服务器在3000端口启动成功......');
})