美文网首页
NodeJS构建一个markdown页面

NodeJS构建一个markdown页面

作者: 街角仰望 | 来源:发表于2016-12-24 01:15 被阅读2619次

1、为项目添加markdown-js依赖,加入markdown解析能力:

express 并不直接支持markdown语法,需要为项目添加markdown-js模块的依赖.
这里我们要修改package.json文件,添加相关依赖:


原package.json文件

{
  "name": "blog",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "body-parser": "~1.15.2",
    "cookie-parser": "~1.4.3",
    "debug": "~2.2.0",
    "ejs": "~2.5.2",
    "express": "~4.14.0",
    "morgan": "~1.7.0",
    "serve-favicon": "~2.3.0"
  }
}

修改成:


{
 "name": "blog",
 "version": "0.0.0",
 "private": true,
 "scripts": {
   "start": "node ./bin/www"
 },
 "dependencies": {
   "body-parser": "~1.15.2",
   "cookie-parser": "~1.4.3",
   "debug": "~2.2.0",
   "ejs": "~2.5.2",
   "express": "~4.14.0",
   "morgan": "~1.7.0",
   "serve-favicon": "~2.3.0",
   "markdown-js": ">= 0.0.1"
 }
}

在最下面加入:"markdown-js": ">= 0.0.1"

name: 指定我们app的名称,
dependesies: nodejs中定义依赖库,这里添加了对markdown-js的依赖,
private: 制定是否将程序发布到npm全局仓库中

使用npm安装依赖:

$ npm install

安装成功后,在 ./node_modules 目录下会多出一个 mardown-js 目录

2、让Express支持Markdown:

打开index.js开始编写node.js代码, 在没写任何代码前的index.js大致如下:

var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
 res.render('index', { title: 'Express' });
});

router.get('/fendo', function (req, res) {
 res.send('hello,world!');
});

module.exports = router;

第一行导入 express 模块, 可以理解成java中的import [packagename]。一会需要用这个语法来导入markdown-js模块模块

在里面加入:

var markdown = require('markdown-js');

首先我们设计一个url

在index.js添加如下代码:

router.get('/markdown', function(req, res) {  
    //markdown.markHtml(); 是将markdown格式的字符转换成Html
    var html = markdown.makeHtml("[fendo](http://blog.csdn.net/u011781521?viewmode=contents \"Click\") ");  
    res.send(html)  
    res.end();  
})

访问:http://localhost:3000/markdown点击fendo就进入了我的博客。

3、让Express渲染markdown文件

在app.js中引入

var fs = require('fs');
var markdown = require('markdown-js');

然后给Express注册Markdown渲染器

app.engine('md', function(path, options, fn){  
  fs.readFile(path, 'utf8', function(err, str){  
    if (err) return fn(err);  
    str = markdown.parse(str).toString();  
    fn(null, str);  
  });  
});  

完整的代码:

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

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


var fs = require('fs');
var markdown = require('markdown-js');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', index);
app.use('/users', users);



// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// 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');
});

app.engine('md', function(path, options, fn){  
  fs.readFile(path, 'utf8', function(err, str){  
    if (err) return fn(err);  
    str = markdown.parse(str).toString();  
    fn(null, str);  
  });  
});  

module.exports = app;

修改 "/markdown" url的处理程序

router.get('/markdown', function(req, res) {  
   res.render('index.md',{layout:false});
})  

在views/目录下创建一个 index.md 文件
内容如下

his is a demo page
===================
[fendo](http://blog.csdn.net/u011781521?viewmode=contents \"Click\")

重新运行项目: npm start

访问 http://localhost:3000/markdown

已经成功构建了第一个markdown页面。

参考:
http://www.2cto.com/kf/201612/573963.html

相关文章

网友评论

      本文标题:NodeJS构建一个markdown页面

      本文链接:https://www.haomeiwen.com/subject/zhzzmttx.html