picgo-plugin-gitee-uploader正式发布

什么是picgo

picgo是一款免费的图床管理工具,简单点就是管理你的图片的工具
非常适合写博客使用。它支持github,阿里云,腾讯云,七牛等存储服务器

markdown痛点

众所周知,在markdown中插入图片是很蛋疼的一件事

上传麻烦

在markdown中上传图片,原生的就是自己手动写标签,然后指定一下图片地址
那这些图片从哪来呢,肯定要先上传
但是一般写markdown的都是本地拿个记事本都能写的人
去哪弄服务器上传图片,然后再把地址贴进来?
如此麻烦,还不如打开有道云笔记,直接截图复制粘贴多简单

迁移麻烦

如果markdown图片是本地的,那么以后你要迁移到其它地方
比如放在有道云里面,这就很麻烦了。你原来的图片地址都要改掉
事实上有道云对markdown的支持真的挺不错的
但是markdown中上传图片是收费的。。。
所以我找到了picgo

picgo的好处

图床服务丰富

支持的图床服务实在是太多了,最重要的是它支持github
免费的~ picgo-picbed

上传方便

  • 你可以点击上传
  • 你可以拖进去上传
  • 你可以直接上传剪贴板中的图片
  • 你可以最小化成一个小图标放在电脑任意位置上传、
  • 你可以使用快捷键上传
  • 最重要它还有vscode插件,而本文就是用vscode写的picgo

自定义图片URL格式

你上传完后会,默认会生成一个链接在你的剪贴板
在上图中可以看到,这个链接支持5种格式
你要做的只有2步:

  1. 上传
  2. 粘贴URL
    简单得不能再简单了
    妈妈再也不用担心我用markdown写博客贴图
    so easy~

本文用的是最后一种自定义格式,为什么呢
比如第一种格式markdown写法是这样的
![图片示例](https://note.youdao.com/favicon.ico)
有人说这样不是挺好的么,挺markdown的
但是它有一个致命的缺点,没有css
除非你自己写一套markdown渲染和css一直带着

比如我用的是gitee
自定义格式配置的如下:
picgo-custom
那么它生成的图片是这样的

1
2
<img src="https://gitee.com/lizhuang/blog-images/raw/master/blog/  
2019/summer/picgo-custom.png" alt="picgo-custom" style="height:300px" />

自定义格式有什么好处
它可以设置宽高,也可以添加css样式。
有些博客图片可能是一张壁纸,如果你不设置宽高
那你等着看好戏吧,你的文章内容会被撑爆
而且每个博客里面的图片,不同的位置图片大学往往不一样
比如本博客中的首页缩略图、正文内容、相册

相册管理

picgo还有一个相册管理功能,你上传后的图片在这里可以轻松管理。
但是有一点你需要注意的是,这些相册都是你用picgo上传到对应的图床的
如果不是用picgo上传的,是看不到的。你对本地相册做得删除,也只是对本地的相册操作而已。
picbed-pictures
注意并不是所有的图床都是这样。
比如githubplus和gitee插件就实现了本地和服务器之间的图片同步,删除也是同步的,请谨慎操作。

我为什么要写picgo的gitee插件

  1. github太慢,经常抽风无法访问
  2. 阿里云、腾讯云之类的收费产品没有兴趣
  3. gitee是开源中国旗下的代码托管工具,在国内用起来还挺不错的
    正好它也有pages服务,并且提供了openApi

gitee的来源

gitee是我用githubplus这个插件修改来的
它实现了github和本地图片的同步以及删除操作。感谢作者!
不过他的源码中github是使用nodejs版本的api实现的
而gitee并没有nodejs相关的封装,只有openApi
本来我是给picgo作者提了issue的,但是作者不打算加再入其它图床
其实可以理解,毕竟这需要太多精力和时间了

无奈之下,硬起头皮自己干

开发此插件你需要了解什么

  1. nodejs npm安装、打包、发布
  2. picgo和picgo-core的官方文档
  3. typescript
  4. nodejs && typescript如何发送请求
  5. gitee oauth和openApi文档

正好以上这些我都会一点。偏偏我不熟悉的vue,插件用不到
天时地利人和,于是我花了3天的时间研究和看文档

顺便从githubplus源码中学到了不少东东,比如

  1. conventional-changelog
  2. npx
  3. request-promise
  4. 等等其它一些小玩意儿

虽然我是JAVA WEB后端开发,但是我对前端兴趣一直很大
我个人非常喜欢Angular,至于vue我一直没去学习
是因为vue界面里面一坨的代码,对我一个代码洁癖的人来说
无法接受
可惜的是当年AngularJS1.x和Angular2之间断了太长时间
导致后来市场已经被vue和react占领了
目前天朝vue更火一些(我觉得原因主要是上手简单、中文文档丰富,国内生态更好)
而国外则是Angular很火
不过vue3.0,尤大说准备用typescript重写
尤大:typescript真香 知乎原文
所以我准备等3.0出了再学~ 预计年底发布

未来可期

picgo-plugin-gitee-uploader

github
changelog



- - - - - - 本文结束 感谢您的阅读 - - - - - -
觉得文章不错?请我喝杯奶茶吧~蓝莓味~
0%