全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

时间:2023-03-10 07:25:50
全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客

1.背景

我挺喜欢写博客,但每一次将博客转移到公众号或者知乎,总是需要调整格式,不能一步到位。有没有办法可以管理自己的博客,还真有:MarkDown文档。各个平台,一步到位,格式完全相同。完美!

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

2.简介

Markdown 简称md,是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档。最常见的是gituhub中的说明文档。这是一种非常擅长写作,而不用在意写作格式的工具。 作用:博客内容的文档格式。

Visual Studio Code:运行于 Mac OS X、Windows和 Linux 之上的,针对于编写现代Web和云应用的跨平台源代码编辑器。作用:写作博客的编辑器。

Markdown Nice是一个浏览器插件,能够进行自定义样式的 Markdown文档编辑,安装之后,能够支持公众号md文档编辑。 作用:将公众号变为支持markdown。

gitee,中国的github,码云,可以用gitee的免费仓库,作为md文档的图床。作用:作为保存图片的图床。

PicGo,图床工具,就是自动把本地图片转换成链接的一款工具。作用:上传图片到gitee的工具。

3.Visual Studio Code的安装与使用:

百度Visual Studio Code,进入官网,下载。

下载地址: https://code.visualstudio.com/.

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

不用担心,虽然Visual Studio收费,但是Visual Studio Code是完全免费的。等待安装完之后,给Visual Studio Code安装几个插件,分别是:

Chinese (Simplified) Language Pack:中文的语言包;

markdownlint:可实时展现md文档渲染内容。如下图所示:

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

可以看到,左边是你写的md文档内容,右边是markdown的渲染效果,方便及时调整。

第一次使用md文件书写,可能不太适应,但只要记住一二级标题打#;需要使用图片时,采取图片链接就差不多可以了。

4.Markdown Nice的安装与使用:

Markdown Nice的安装分两种,第一种是直接在chrom等浏览器商店安装插件,第二种是百度Markdown Nice下载插件安装包,再解压安装到浏览器中。

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

待安装好之后,注册后,再打开公众号编辑器,就发现支持markdown编辑了:

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

pig

5.gitee+PicGo的安装与使用:

这一步是建立自己的图床,保障自己的md文档中图片链接以后不会消失。当然也可以用免费的图床(何必受制于人)。

(1)先注册gitee(为什么不要github?国内网速慢!)与下载PicGo;

gitee的网址:https://gitee.com/.

PicGo的网址:https://github.com/Molunerfinn/PicGo/releases/tag/v2.3.0-beta.7.

(2)在gitee中,新建一个公共仓库(一定要是公共,不然图片无法使用),记得初始化,如图所示:

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

(3)获取这个仓库gitee的私人令牌token,复制保存下来,这个token只会出现一次:

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

(4)设置PicGO,将图床与gitee仓库匹配:安装插件gitee、设置参数。详见截图:

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

第一个框是你的gitee用户名,第二框是仓库名,第三个框是token。

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

(4)尝试上传图片,可以直接从粘贴板的截图或者本地文件上传,上传之后会出现在图库中:

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

上传后,直接ctrl+v复制链接到md文件中,也就完成了。

6.公众号****、博客园的md编辑器,直接复制即可,知乎则是使用自带的md文件导入功能。

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章

7.总结:

1.如果你写论文,有三分之一的时间都在调整格式,那一定要试试md,让你更专注于论文本身;

2.如果你的公司电脑加密(例如我),写一个word都是被公司加密的,那恭喜:md一般不会被ip guard等软件加密。

3.多使用markdown工具,可以节省你同步文章到多个平台的速度,不用修改格式,一键复制。

vx: kitmyfaceplease2;欢迎关注公众号:锐多宝的地理空间;

全流程指导Visual Studio Code+Markdown Nice+gitee+PicGo管理自己的技术博客文章