一、vscodemarkdown预览不对其
vscodemarkdown预览功能可以方便地在 vscode 编辑器中查看 markdown 文件的效果,并且具有实时更新的特点。但是在使用中,由于不同的编译器解析 markdown 文件的方式不同,有时候预览的效果与实际情况可能存在偏差。如何解决这个问题呢?
可以使用视图的右上角的“打开预览”按钮,切换预览的方式进行比较,如果你使用的是 vscode 内置的 markdown 渲染器,则可以尝试使用第三方的 markdown 渲染器替代它。
{
"markdown.preview.sideBySide": true,
"markdown.preview.scrollEditorWithPreview": true,
"markdown.preview.scrollPreviewWithEditor": true
}
二、vscodemarkdown实时预览
vscodemarkdown 的实时预览是非常强大的,无需保存就可以看到 markdown 文档的效果,这对我们的编写和调试都非常方便。同时,也降低了阅读和理解 markdown 的难度。
在 vscode 编辑器的默认设置中,实时预览可以通过从视图菜单中的“切换实时预览”或使用 vscode 命令面板中的“markdown: 切换实时预览”来启用。当打开实时预览时,你可以直接编辑 markdown 文件,预览窗口中将自动更新显示你所做的更改。
{
"markdown.preview.autoshowPreviewToSide": true,
"markdown.preview.autoReveal": false,
"markdown.preview.breaks": true
}
三、vscodemarkdown插件
vscodemarkdown 插件可以极大地扩展 vscode 的 markdown 功能,例如语法高亮、目录构建、图表绘制、数学公式渲染等等。这些插件可以帮助程序员们更高效和舒适地编写 markdown 文件。
下面是一些常用的 vscodemarkdown 插件:
- Markdown All in One
- Markdown Preview Enhanced
- Markdown Mermaid
- Markdown TOC
- Markdown PDF
四、vscodemarkdown转pdf
vscodemarkdown 转 pdf 可以帮助我们将 markdown 文件转换为 pdf 文件,使之更好的输出或分享。不过,有时候在进行转换的时候可能会遇到麻烦,需要使用特定的编写和渲染方法。
下面是一个示例,使用以下yaml部分配置文件可以使 markdown-pdf 插件更准确地渲染 pdf:
{
“markdown-pdf”:{
“preferredDPI”:72,
“preProcessMd”:false,
“paperBorder”: “1cm”,
“paperWidth”: “8.27in”,
“paperHeight”: “11.69in”,
“chromePath”: null,
“configPath”: null,
“timeout”: 10000,
...
}
}
五、vscodemarkdown粘贴图片
在 markdown 文件中添加图片时,我们可以使用网址链接,也可以直接拖放图片到 markdown 文件中,还可以使用剪贴板中的图片。
vscodemarkdown 对于使用剪贴板的方式提供了支持。只需复制图像,然后在 markdown 文件中使用 Ctrl+v 粘贴即可。你可以在资源管理器中查找剪贴板上的图像并将其添加到 markdown 文件中,也可以在编辑器中插入剪贴板上的图像。
![cut_image.png](data:image/png;base64,iVBORw0KG...)
六、vscodemarkdown转pdf报错
当我们使用 vscodemarkdown 插件将 markdown 文件转换为 pdf 时,有时会因为不同的环境、插件和设置出现报错。对于报错信息,我们可以通过查看 vscode 控制台、系统日志和 markdown-pdf 日志等信息中来确定问题所在。
下面是一个解决报错的示例,我们可以使用以下配置文件让两个模块之间的版本匹配,从而解决 pdf 转换的兼容性问题:
{
“markdown-pdf”:{
“remarkable”: {
“html”: true,
“typographer”: true,
“quotes”: “”””””
},
...
}
}
七、vscodemarkdown流程图
流程图可以使得文档更易于阅读和理解。使用 vscodemarkdown,我们可以使用以下代码,在 markdown 文件中嵌入流程图:
```mermaid
graph TD;
A-->B;
A-->C;
B-->D;
C-->D;
```