打造程序员自己的“云笔记”

因为工作关系经常在台式机/笔记本，家里/单位切换来切换去，希望能够有一种不用那么费神的保持工作连贯性的方式。git 很好，但太繁琐了，下班走的时候忘记push了，到家就续不上了。当然我指的不是开发的代码，而是一些文档性的东西，譬如一些计划、一些学习心得，在网站上查东西的时候也会有一些随笔的记录什么的，因为太零碎，又随时希望能够查到，所以觉得也许云笔记是一个不错的选择。

在使用了一年左右的“xx云笔记”后，感觉自己越来越难以忍受了，首先的问题是搜索，云笔记的搜索是 word 式的，需要一个一个搜，不支持内容列表、不支持F3，对于程序员来说完全是废物。其次是我曾经在一个 .md 文件中贴了一大段的代码，结果下次打开的时候足足卡了7、8秒，上下翻页也是卡的不行。文档上说md支持很多流程图、甘特图...，结果做好的 .md 文件发到 github 上很多都显示不了，大都是自己的扩展，离开了“xx云笔记”后就是一堆谁都看不懂的东西。

那么有没有更加符合程序员需求的“云笔记”呢，因为日常开发上经常使用 vscode 做开发，vscode 无论在编辑还是搜索上，都完全符合要求。于是就考虑能否用 vscode 打造一个符合自己的“云笔记”，我们都知道 vscode 里面有大量的插件，而且可订制化非常强，那么能否把 vscode 改造成符合自己要求的“云笔记”呢，抱着这个想法开始了对 vscode 的研究工作。

云服务器的选择

如果想做到跨设备同步，一个云存储后台是必须要有的，那么第一个问题就是选择什么样的云后台服务器。这里我又回到了 git 的怀抱，毕竟 git 服务器是非常成熟的解决方案，而且 vscode 与 git 的配合是天生的。而且即使没有“云笔记”的垃圾桶功能也不怕误删除文档，git 用来干这个事完全是大才小用。

我可以选择 github 或 “码云”，反正都是免费的，完全够用了，在国内选择“码云”会比 github 快一些。如何去注册 github 或 “码云”的账户就不在这里说明了，不了解的朋友可以自行搜索。

自动化的同步

下一个问题是 git 的操作问题，git 的设计目标是为了做代码管理的，但我希望的效果是像云笔记那样的完全无感的自动化同步，如果每次都要记着 push/pull 就还不如用云笔记了。在插件仓库里面各种查找和测试，终于找到一个基本符合需要的插件 -- Auto-Git，这个插件可以定时自动从仓库里面 push/pull 数据，正是我需要的。

这个插件装完了，会在我当前的文档工程下建立一个 .autogit 目录，里面有一个 autogit.json 文件，这个文件是 Auto-Git 的配置文件，例如我的配置：

{
  "updateInterval": 1800,
  "logging": false,
  "silent": true
}

• updateInterval
  是这个插件同步代码的时间，我设定为 1800 秒，也就是半小时，当然你可以设定的更短一些，但半小时对我来说足够了，因为我单位的电脑从来不关机，从单位到家也不止半小时。
• logging
  指是否要在上传下载的时候生成 log，完全不需要，我只要结果，不关心过程。
• silent
  静默模式，当然了，要不我装你干嘛。

插件装好后，你可以在下面的状态栏左侧看到类似:

Next Auto-Git in... 1265

的显示，这就是告诉你在 1265 秒后开始自动同步数据。

最后还有一个比较麻烦的问题，我只想在我的文档项目中使用 Auto-Git，不想在真正的开发项目中做这种自动化的同步，容易把其他人搞晕。这个问题的解决办法是给我的文档工程建立一个工作区，然后全局禁用 Auto-Git，然后再在这个工作区上单独开启 Auto-Git，这样就让这个插件只在这个工作区开启了。

像 github 一样显示 .md 文档

首先我的文档基本都是 .md 格式的，有时候写好的文档会上传到 github 这样的代码平台上。vscode 是自带 .md 的显示支持的(Ctrl-K V)，但它默认的显示效果跟 github 上显示的 .md 的显示效果并不一样，那么有没有办法能够让我在 vscode 里面看到跟 github 上一样的显示效果呢？好在并不是只有我有这样的需求，网上已经有人做过了：

https://github.com/raycon/vscode-markdown-style

这个项目 preview 目录下的 github.css 就是我需要的。把这个文件下载回来，放到文档项目的 .vscode 目录下(为了避免干扰正常的文档文件)，然后打开 .vscode 目录下的 setting.json 文件，加入：

"markdown.styles": [
    ".vscode/github.css"
]

现在再预览 .md 文件就跟在 github 上看到的一致了。

像“xx云笔记”一样编辑 md 文件

因为用了一年的“xx云笔记”，已经习惯了绿色的标题、蓝色的代码，在用 vscode 写 md 后，编辑环境的颜色就各种不习惯，本人又是轻度强迫症患者，一定要把 vscode 的编辑环境也搞得跟“xx云笔记”一样才行。
本来以为有插件能帮我搞定这个事，但测试了一圈各种插件后，发现没有符合我需要的插件，我不相信 vscode 无法搞定这个事，在网上搜到一篇《VSCode 修改编辑器配色》的文章后，才豁然开朗，原来 vscode 本身就支持订制化。

这个就不能在当前工作区的设置里面改了，必须要改全局的 setting.json，

1. 按 Ctrl+Shift+P打开 vscode 控制台
2. 输入 Open Settings(JSON) 打开全局的 setting.json

3. 在后面加入:

   "editor.tokenColorCustomizations" : {
       "textMateRules" : [
           {
               "scope" : "markup.heading.markdown",
               "settings" : {
                   "foreground" : "#8bcc8b",
               }
           },
           {
               "scope" : "markup.fenced_code.block.markdown",
               "settings" : {
                   "foreground" : "#6699cc",
               }
           },
           {
               "scope" : "punctuation.definition.list.begin.markdown",
               "settings" : {
                   "foreground" : "#a0a0a0",
               }
           }
       ]
   }

   现在就能看到熟悉的绿标题，蓝代码了，如果没看到请重启 vscode。

结束语

虽然花了不少时间去研究，一旦成功了还是非常有成就感的。在这里把自己趟过的坑跟大家分享一下，希望有更多的程序员朋友能够跟我一样订制出最符合自己的“云笔记”，也希望能够跟我一起分享你的订制心得。