网站logo怎么做的,商品网站开发需求表,包头网站建设制作,美工网站经常用的编辑器是Markdown#xff0c;有自带预览排版效果功能的#xff0c;预览的是HTML网页#xff0c;如果想要将它转换成HTML网页文件#xff0c;要怎么做呢。
首先#xff0c;借助Node的插件来做#xff0c;在使用前#xff0c;确保电脑已安装了NodeJS应用#xf…经常用的编辑器是Markdown有自带预览排版效果功能的预览的是HTML网页如果想要将它转换成HTML网页文件要怎么做呢。
首先借助Node的插件来做在使用前确保电脑已安装了NodeJS应用
初始化项目
用VSCode或者HBuilderX开发工具建一个项目(文件夹)例如项目名如md_to_html 如果用VSCode开发工具可以安装一个叫Markdown Preview的插件打开md文件的预览窗口点鼠标右键菜单会看到自带一些功能如下图其中的HTML(offline)可以用 如果不采用上面的简单操作完成那么继续往下看 在项目跟目录下打开集成终端输入以下命令初始化配置
npm init初始化项目完成会看到生成了一个package.json文件这是项目配置例如下图
安装markdown-it
接着输入以下命令安装Node需要的工具库 markdown-it
如下命令安装完成会出现上图中的node_modules文件夹
npm install markdown-it --save然后写一个测试文件test.js代码如下同上图中的md_to_html.js文件
var fs require(fs);
var markdowner require(markdown-it);var md new markdowner({html:true,prefix:code-
});console.time();var sourcedata # html world;var html md.render(sourcedata||);fs.writeFileSync(./test.html, html);console.timeEnd();看上面的代码里 sourcedata就是存储的Markdown文档的内容如果直接从文档中读取可以改成代码如fs.readFileSync(./test.md)读取 生成HTML文件
输入命令执行脚本应用没错的话会生成一个test.html文件同上图中的md_to_html.html文件
node test.js看看生成的HTML文件源代码没问题用浏览器打开就会报错如下图 index.html这个文件名错了但浏览器默认是打开这个文件的 浏览HTML文件
要放在web服务器上才行解决打不开问题就安装一个express框架Express 中文网输入以下命令
npm install express --save创建一个public文件夹把生成的html文件放在这个文件夹里
在项目根目录下写一个文件app.js引入express框架的脚本代码如下
const express require(express)
const app express()
const port 3000app.use(express.static(public))
app.get(/, (req, res) {res.send(hello wolrd)
})app.listen(port, () {console.log(Example app listening on port ${port})
})然后输入以下命令运行脚本app.js就能打开一个web本地站点服务器 如上图所示表示已正确打开web服务器 最后打开浏览器输入地址http://localhost:3000/md_to_html.html这里在线预览成功了。
