vscode编写markdown

  • [1. 需求分析](#1. 需求分析)
  • [2. 环境搭建](#2. 环境搭建)

1. 需求分析

最近在网上折腾了好久Markdown的写作环境,作为一个普通用户,总结一下个人对于Markdown写作环境的几点需求。由于本人刚接触Markdown不久,因此,需求也比较简单,想看具体搭建步骤的可以直接跳到第二章环境搭建

  1. 本地存储。这一点主要是出于隐私要求,由于记录内容和个人强相关,以目前的网络环境来看,文件存在本地最为安全。
  2. 云端同步。这一条和第一点并不矛盾,在作者想要发布的时候,能够方便地将文档发布到云端,不想发布的时候,只在本地存储,而当云端文档发生变化时,也能及时pull到本地。
  3. 实时预览。所写即所见,写出来的同时能够看到效果,这对于修改和写作非常重要!反之,没有预览效果,用户难以把握最终完成效果。部分编辑器虽然有预览的功能,但预览需要手动点击或执行快捷键操作,这种非实时的预览,会导致用户在写作时,注意力不断被打断,写作体验非常不流畅。
  4. 同步滑动原文定位 。当文档过长时,预览和原文往往很难对应起来,这表现为两个方面:
    • 编辑或修改完原文之后,不知道最终预览情况,这个时候原文和预览同步滑动,可以帮用户快速定位到当前编辑的位置,并查看预览效果。
    • 当用户发现预览没有达到预期效果,并尝试进行更改时,如果预览不支持反向定位到原文,那么用户可能会花费很长的时间才能找到原文中对应的位置。
  5. 工具栏。虽然Markdown语法简单,容易学习,但是对于普通用户来说,依然存在学习门槛,而且一段时间不使用的话,语法和快捷键操作很容易忘记。如果编辑器有工具栏,那么用户的学习成本就大大降低了。毕竟大多数用户并不是经常写作,而且工作生活中需要学习的东西已经太多了,即使是简单的语法,对于普通用户来说,学习成本也会很高(学习成本并非线性增长)。
  6. 图片上传。在使用各类编辑器之前,我原以为这是一个非常常规的需求,然而网上各类方法对于这个功能的实现并不理想。
  7. 背景颜色可变
  8. 支持表格,流程图等语法
  9. 目录生成,也称TOC生成。

2. 环境搭建

总体思路是,采用vscode作为文本编辑器,同时利用各类插件,实现以上各类需求。vscode的安装这里就不赘述了。这里重点介绍使用到的Markdown插件。

  1. Markdown All in One。支持实时预览,同步滑动,快捷键,目录生成等各种功能。打开命令面板,在其中输入mio,可以快速查找该插件支持的各种命令。
  2. learn-markdown。微软官方推出的markdown插件,对于小白而言,最好用的是有一个工具栏常驻在状态栏里,避免记忆常用的快捷键。
  3. 博客园cnblogs客户端。博客园推出的官方插件,借用该插件可以实现图片上传,云端同步的功能。
  4. Markdown TOC & Chapter Number。支持右键目录生成,标题编号。如果熟练使用了Markdown All in One的目录生成功能,该插件可选。
  5. Markdown Theme Kit。微软官方推出的markdown插件,支持几种markdown主题,当然也可以直接改变vscode的theme。

以上插件均为本人亲测后,感觉使用体验良好的插件,如果大家还有用过不错的插件,欢迎推荐和交流。

补充一些网友推荐的其他插件,这里汇总一下:

  1. Picgo:图床,也可以用来上传图片,进行图片管理;
  2. Pangu-Markdown:格式化文档;
  3. Marp for VS Code:Markdown转PPT;
  4. markmap:Markdown转思维导图。
    谢谢各位网友的推荐!
相关推荐
小poop1 小时前
VS实用调试技巧详解
vscode
π同学1 小时前
ESP-IDF+vscode开发ESP32第十五讲——队列、流缓冲区、环形缓冲区
vscode·esp32·缓冲区
anthonyzhu1 小时前
安卓Android studio panda run无法应用更新的问题
android·ide·android studio
寂夜了无痕2 小时前
IntelliJ IDEA 高效配置:新建文件自动生成作者与时间注释
java·ide·intellij-idea
golang学习记2 小时前
Intellij IDEA 2026重磅更新!开发体验大升级
java·ide·intellij-idea
愿天垂怜4 小时前
【C++脚手架】ffmpeg 库的介绍与使用
linux·服务器·开发语言·c++·ide·git·ffmpeg
cheungxiongwei.com6 小时前
VSCode Copilot 如何配置第三方API/自定义端点?
ide·vscode·copilot
游戏开发爱好者86 小时前
iOS开发工具推荐:Xcode、AppCode、SwiftLint使用心得与效率提升
ide·vscode·macos·ios·个人开发·xcode·敏捷流程
AI行业学习6 小时前
CC-Switch 下载、安装与使用配置指南【2026.5.29】
java·开发语言·vscode·python·eclipse·laravel
huangfuyk6 小时前
前端使用Cursor编辑器方面遇到的问题及注意细节
前端·编辑器·ai编程·cursor