用markdown-it工具编译markdown文件
我的上篇博文整理了如何在vscode中使用markdown PDF插件来编译sample.md文件方法,后来发现,markdown PDF插件不支持markdown math扩展,因此,这两天我在vscode的documentation中看到了类似于markdown PDF的插件的markdown-it,索性照上面的方法,试着编译了sample.md文件。下面来介绍我使用markdown-it编译sample.md文件的详细过程。
一、工具准备
1、vscode
2、node.js运行时库(里面包含npm工具)
3、markdown-it
其中node.js及npm工具的安装过程见:https://www.runoob.com/nodejs/nodejs-install-setup.html
下面来介绍markdown-it的安装过程,由于markdown-it目前没有出现在vscode的marketplace中,所以不能在vscode中的应用商店下载,只能借助于npm工具下载。
打开windows的命令行工具(cmd),键入命令:(其中-g表示在你的电脑上全局安装)
npm install -g markdown-it
安装完成后输入命令:
markdown-it -v
若能正确显示版本号,则表明安装成功。
二、创建tasks.json文件
在vscode的工作文件夹sample下建立sample.md文件,具体内容如下:
# Hello Markdown in VS Code!
This is a simple introduction to compiling Markdown in VS Code.
Things you'll need:
* [node](https://nodejs.org)
* [markdown-it](https://www.npmjs.com/package/markdown-it)
* [tasks.json](/docs/editor/tasks)
## Section Title
> This block quote is here for your information.
配置sample.md文件的tasks.json文件,Tasks > Configure Tasks并且点击 Create tasks.json file from templates。然后,VS Code会显示一个可能的tasks.json模板列表供您选择。 选择Others,因为我们要运行外部命令。这会在工作区.vscode文件夹中生成tasks.json文件,其中包含以下内容:
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "echo",
"type": "shell",
"command": "echo Hello"
}
]
}
要使用markdown-it编译Markdown文件,请按如下所示更改内容:
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "Compile Markdown",
"type": "shell",
"command": "markdown-it sample.md -o sample.html",
"group": "build"
}
]
}
三、编译sample.md文件
选择Tasks > Run Build Task或者快捷键Ctrl+Shift+B。 由于我们只想将Markdown文件转换为HTML,因此选择“Never scan the build output from the presented list”。
此时,您应该会在文件列表看到sample.html文件。