HTML转为md,使用node将md转义为html

想将md转义为html，本质上就是利用正则将md语句转义为html语句，这里我们利用现有的转义库 marked

首先

新建一个空的仓库 mdToHtml

mkdir mdToHtml

cd mdToHtml/

npm init

下载marked， 新建文件

npm i marked

touch index.js

touch test.md

test.md

### 标题

index.js

// 首先引入我们需要用到的模块

const fs = require("fs")

const path = require("path")

const marked = require("marked")

// md文件路径

const filepath = path.join(__dirname, 'test.md')

// fs 读取文件内容

fs.readFile(filepath, "utf8", (err, data) => {

if (err) {

console.log(err);

return;

}

let html = marked(data);

console.log(data, html)

})

打开控制台输入 node index.js

image.png

现在已经将md语句转换为html标签了，接下来，我们那用模版字符串，生成一个完整的html页面

首先下载ejs

创建模版字符串

const ejs = require('ejs')

const template = `

Md to Html

`

let pageHtml = ejs.render(template,{html})

console.log(data, html,pageHtml)

内容已经产生了，结下来就需要生成文件，并将内容写入文件了，还是利用fs模块

// fs.mkdir 创建目录

fs.mkdir('Public', function (error) {

if (error) {

console.log(error);

return false;

}

console.log('创建目录成功');

})

//fs.writeFile 写入文件(会覆盖之前的内容)(文件不存在就创建) utf8参数可以省略

fs.writeFile('Public/index.html', pageHtml, 'utf8', function (error) {

if (error) {

console.log(error);

return false;

}

console.log('写入成功');

})

运行脚本

image.png

生成如下目录

.

├── Public

│ └── index.html

├── README.md

├── index.js

├── node_modules

│ ├── ejs

│ └── marked

├── package-lock.json

├── package.json

└── test.md

查看Public/index.html文件

image.png

浏览器中查看

image.png

更方便一点，我们可以用fs的监听md文件的变化，自动执行脚本

fs.watch(filepath,( function () {

var count = 0;

return function(){

count++;

console.log("文件" + filepath + " 内容刚刚改变。。第" + count + "次" );

// todo

})

fs.watch的最大缺点就是不支持子文件夹的侦听，并且在很多情况下会侦听到两次事件(很多编辑器在保存的时侯是先把原文件清空，再进行保存，因此会触发两次文件夹改变事件)。因此需要一些开源的模块来监听文件夹目录的改变。感兴趣的同学可以自己找一下解决方案。

完整代码