VS Code使用 Markdown 图床

概述

VS Code是一个扩展性极强的编辑器,有非常丰富的插件。安装Markdown All in One插件之后vscode就成为一个Markdown编辑器。支持预览,对语法的支持也非常好,唯一的缺点就是不能上传图片,以至于每次写博客的时候都要切到网站上粘图片再拷贝连接回来,非常麻烦。

picgo介绍

好在,VS Codepicgo插件,可以让我们用快捷键即可上传图片到默认的免费服务器,具体的使用方法见下一节。 但是还有一个很要命的问题是,由于picgo默认上传的服务器是SM.MS服务器,由于你懂得原因,国内的访问速度让人抓狂,但是picgo支持七牛云作为图床。

配置图床

配置七牛云

我们在浏览器打开七牛云的「控制台」,切换到「对象存储」,新建一个公开的空间,这里我将空间名称命名为blog-picbed(自由命名),空间名称自行定义,后面会用到。

打开创建好的空间,需要添加「CDN加速域名」,域名的格式为「cdn.+自己注册的域名」,接着需要配置右侧的「CNAME」,将鼠标移动到CNAME上方,它会给出配置CNAME的指导。

复制七牛云空间的CNAME值,接着打开你注册的域名的「DNS 解析页面」,因为我是在阿里云注册的域名,这里打开的就是腾讯云的管理后台。

在解析列表中新增一条记录,主机记录为cdn,记录类型选择CNAME,记录值位置粘贴刚从七牛云得到的CNAME值。

部署markdown文件的静态网站可能需要https协议访问,此时需要配置域名的证书,这一部分根据七牛云的提示进行。

配置picgo七牛图床

在使用之前,需要配置,这里我们演示了七牛图床的配置。 1、AccessKeySecretKey:可以在七牛云控制台,秘钥管理页面找到你的配置

2、存储空间名:填写前面创建的空间名称

3、访问地址:对应前面提交的测试域名,需要完整域名(例如:http://cdn.***.tech)

4、存储区域:七牛云的存储区域(华东 z0,华北 z1,华南 z2,北美 na0,东南亚 as0 ),根据你空间所在的区域,填对应的代码

picgo_config_1 picgo_config_2

使用方法

你可以使用以下快捷键完成图片上传

操作系统 从剪贴板上传图片 从文件浏览器上传图片 从一个输入框上传图片
Windows/Unix Ctrl + Alt + U Ctrl + Alt + E Ctrl + Alt + O
OsX Cmd + Opt + U Cmd + Opt + E Cmd + Opt + O

参考链接

知乎

来发评论吧~
Powered By Valine
v1.5.2