码迷,mamicode.com
首页 > 其他好文 > 详细

快速构建express项目

时间:2016-12-18 21:08:58      阅读:250      评论:0      收藏:0      [点我收藏+]

标签:路由   app.js   lin   nbsp   使用   ace   oca   otto   style   

附件技术分享

分13步: 
1.全局安装express

npm install -g express

2.全局安装express-generator

npm install -g express-generator

(此时可以测试一下,输入express - -help) 
3.进入到·工程父目录

cd [工程父目录名]

4.快速创建工程结构

express -t [模板引擎名:ejs/jade] [工程名]   我一般是用express -e mypro



5.替换ejs,修改package.json,将里面的ejs删除
6.下载node_modules  ,执行命令 node install
7.安装nunjucks,执行命令 npm install --save nunjucks
8.修改app.js,替换其中的模板引擎

  1. var nunjucks = require(‘art-template‘);
  2. // 配置使用 NunJucks 模板引擎
  3. const env = nunjucks.configure(path.join(__dirname, ‘views‘), {
  4. noCache: true
  5. })
  6. env.express(app)
9.修改views/index.ejs, views/error.efs ==>index.html,error.html
    将里面的<%= xx %>替换成{{  xxx}}

10.修改app.js,routes/index.js
    将其中的render("xxx")加后缀修改成render("xxx.html")

11.在app.js同级目录添加config.js
  1. var path = require(‘path‘)
  2. module.exports = {
  3. }

12.在app.js 同级目录添加controllers目录,并在目录下添加index.js,用于存放路由的具体业务逻辑
    
  1. module.exports.homePage = (req, res, next) => {
  2. res.render(‘index.html‘,{title:‘Express‘});
  3. }


13.修改routes/indexs.js路由
  1. var express = require(‘express‘);
  2. var router = express.Router();
  3. var handler = require(‘../controllers/index‘)
  4. /* GET home page. */
  5. router.get(‘/‘, handler.homePage);
  6. module.exports = router;


14.正式开发,在routes目录下有个user.js路由,我们每次访问该网址应该是 http://localhost:3000/user
,所以route.use(‘/user‘,..)在该js中出现多次

修改app.js
  1. var user = require(‘./routes/user‘);
  2. // 挂载用户路由
  3. // 加上前缀,这样的话,user 中的路由就都必须是以 /user开头才行
  4. app.use(‘/user‘,user);

修改routes/user.js
  1. var express = require(‘express‘);
  2. var router = express.Router();
  3. /* GET users listing. */
  4. router.get(‘/add‘, function(req, res, next) {
  5. res.send(‘add student‘);
  6. });
  7. module.exports = router;
访问 http://localhost:3000/users/add






附件列表

     

    快速构建express项目

    标签:路由   app.js   lin   nbsp   使用   ace   oca   otto   style   

    原文地址:http://www.cnblogs.com/haoyongliang/p/68f0d72f52061e332968eb6bca57c5fc.html

    (0)
    (0)
       
    举报
    评论 一句话评论(0
    登录后才能评论!
    © 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
    迷上了代码!