node.js学习（五）Express安装入门与模块引擎ejs

最新推荐文章于 2023-03-11 11:58:34 发布

Study_Live_Sun

最新推荐文章于 2023-03-11 11:58:34 发布

阅读量289

点赞数 1

分类专栏： node.js

本文链接：https://blog.csdn.net/Study_Live_Sun/article/details/103886194

版权

node.js 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

现在开始进入web开发部分

node.js提供了http模块，这个模块中提供了一些底层接口，可以直接使用

下面我们直接从express框架着手去进行web开发，他实现好了更高层的接口，让web开发更简单快捷

express安装与使用

express是一个轻量级、简洁、易用的node.js web MVC开发框架，它基于node.js原有进行了很多web开发所需的功能封装

http://expressjs.com

https://www.npmjs.org/package/express

安装

npm install -g express-generator

-g表示全局安装

安装完成后在需要建立项目的地方执行 express +项目名操作，完成页面框架的搭建


D:\node>express WebApp

  warning: the default view engine will not be jade in future releases
  warning: use `--view=jade' or `--help' for additional options


   create : WebApp\
   create : WebApp\public\
   create : WebApp\public\javascripts\
   create : WebApp\public\images\
   create : WebApp\public\stylesheets\
   create : WebApp\public\stylesheets\style.css
   create : WebApp\routes\
   create : WebApp\routes\index.js
   create : WebApp\routes\users.js
   create : WebApp\views\
   create : WebApp\views\error.jade
   create : WebApp\views\index.jade
   create : WebApp\views\layout.jade
   create : WebApp\app.js
   create : WebApp\package.json
   create : WebApp\bin\
   create : WebApp\bin\www

   change directory:
     > cd WebApp

   install dependencies:
     > npm install

   run the app:
     > SET DEBUG=webapp:* & npm start


D:\node>

app.js

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express();
app.listen(8100,function(){
  console.log("Server Start");
});
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/users', usersRouter);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

模板引擎ejs

在上面创建的testWebAPP中默认使用的模板引擎为jade，个人觉得jade虽然简洁但是不直观，所以选择了更容易上手的ejs。这也是现在运用最为广泛的node.js模板之一

创建一个node.js基于ejs的项目

express -e testEjsWebApp

cd testEjsWebApp

npm install

代码示例

routes/index.js

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: '<h1>Express</h1>',
                      users:[
                        {username:'wilson'},
                        {username:'zhong'},
                        {username:'hahah'}
                      ]});
});

module.exports = router;

index.ejs

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <%= title %>
    <%- title %>
  <hr/>
  <%
    users.forEach(function(user){%>
        <h4><%-user.username%></h4>
    <%});
 %>
  </body>
</html>

Study_Live_Sun

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
node.js学习（五）Express安装入门与模块引擎ejs

现在开始进入web开发部分node.js提供了http模块，这个模块中提供了一些底层接口，可以直接使用下面我们直接从express框架着手去进行web开发，他实现好了更高层的接口，让web开发更简单快捷express安装与使用express是一个轻量级、简洁、易用的node.js web MVC开发框架，它基于node.js原有进行了很多web开发所需的功能封装http://e...
复制链接

扫一扫