Mac 版 VSCode + PlantUML+uPic + Gitee搭建图床
文章目录
使用 VSCode + PlantUml 画图时，需要将PlantUML的语法转换成图片，上传到图床后，再插入到对应的Markdown文档中，这样可以在未安装PlantUML的机器上查看对应的Markdown文档。
1 使用的软件
VSCode: 是一款现代 Web 和云应用的跨平台源代码编辑器。强大的插件市场可以让你完全自定义你的专属编辑器。
uPic: 一款 Mac图床(文件)上传客户端，它可以将图片、各种文件上传到配置好的指定对象存储中，然后即时生成可供互联网访问的文件URL。支持图床： smms、 又拍云 USS、七牛云 KODO、 阿里云 OSS、 腾讯云 COS、微博、Github、 Gitee、 Amazon S3、自定义上传接口。无论是本地文件、或者屏幕截图都可自动上传，菜单栏显示实时上传进度。上传完成后文件链接自动复制到剪切板，让你无论是在写博客、灌水聊天都能快速插入图片。
PlantUML: 支持快速绘制时序图、用例图、类图、对象图、活动图、组件图、部署图、状态图，定时图等。
2 创建 Gitee 图床仓库
2.1 创建账号
打开码云Gitee，注册账号。
2.2 创建仓库
2.3 创建Token
点击 设置，选择 私人令牌。
点击 生成新令牌
输入 私人令牌描述，方便日后查找，然后提交。
提交后，将会创建新私人令牌，需把令牌及时复制保存起来，接下来将会用到，关闭窗口后，将不再可见，若丢失，需重新生成。
3 配置uPic
3.1 下载安装
安装方式：
-
通过 Homebrew（官方推荐）
brew install --cask upic -
从 github下载安装
-
从 gitee 下载安装
下载地址：uPic 发行版 - Gitee.com
3.2 配置
打开 uPic的偏好设置，选择 图床 选项，添加 Gitee的配置。最后点击 验证，若配置正确，图床仓库对应分支的保存路径内将会有uPic 上传的测试图片。
用户名：Gitee的账号名。
仓库名：上面 [2.2 创建仓库](#2.2 创建仓库) 创建的仓库名称。
分 支：图片上传到的分支名称。
Token ：上面创建的 Gitee的私人令牌。
保存路径：图片上传到仓库后的路径，若仓库无此目录，uPic上传时会创建对应目录。
4 配置 VSCode
4.1 配置 PlantUML
4.1.1 安装 PlantUML
- 通过VSCode 安装 PlantUML 插件；
- 安装PlantUML的依赖软件 jdk及渲染引擎graphviz。
注意： 使用时可能会报找不到 /opt/local/bin/dot 文件的错误，需要做一个软链接。
# 若没有此目录，则需先创建
sudo mkdir -p /opt/local/bin
# 建立文件链接
sudo ln -s /opt/homebrew/Cellar/graphviz/2.48.0/bin/dot /opt/local/bin/dot
4.1.2 编写 uml，生成图片
4.2 配置 uPic
4.2.1 安装 uPic 插件
4.2.2 上传图片
在VSCode中选择图片，然后右键弹出菜单，点击 “Upload via uPic & Copy Urls”。上传完成后，图片链接即可以粘贴到文档中。
5 配置Typora
Typora是一款轻便简洁的Markdown编辑器,支持即时渲染技术，它删除了预览窗口，模式切换器，markdown源代码的语法符号以及所有其他不必要的干扰，以帮助您专注于内容本身。
5.1 下载安装
官网地址： Typora — a markdown editor, markdown reader.
5.2 配置图床
打开 Typora 的偏好设置，点击图像，按以下红框所示进行配置即可。配置好之后，只要将图片复制到文档中，即会自动上传到对应图床，并生成Markdown方式链接到文档中，非常之方便。
