7

Intellij IDEA Plugin DEV (六)

 1 year ago
source link: https://dong4j.github.io/views/tools/2019/03161253.html#aliyun-oss-%E6%8E%A7%E5%88%B6%E5%8F%B0
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

插件需求分析

先来梳理下需求:

开发一款插件将 Markdown 文档中的图片上传到 Aliyun OSS.

具体需求入下:

# 上传需求

解析所有 ![]() 图片标签:

  1. 如果图片在本地, 则上传到 Aliyun OSS;
  2. 如果以 http:// 或者 https:// 开头, 则根据设置判断是否上传(迁移图片到 Aliyun OSS)

上传完成后:

  1. 根据设置将 ![](xxx) 标签转换成 <a data-fancybox title="" href="http://xxxx" >![](xxx)</a> 标签

这里有 2 个设置:

  1. 是否转换为 <a> 标签:
    1. 如果开启, 在判断是否显示大图(这个主要针对 vuepress 构建的博客)
<a data-fancybox title="" href="http://xxxx" >![](http://xxxx)</a>

且要修改 config.js 文件, 添加如下:

// 让 Vuepress 支持图片放大功能
['script', { src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.slim.min.js' }],
['script', { src: 'https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.2/jquery.fancybox.min.js' }],
['link', { rel: 'stylesheet', type: 'text/css', href: 'https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.2/jquery.fancybox.min.css' }]
  1. 如果不开启, 则只转为普通的 <a> 标签, 这样点击图片后, 能新开标签查看大图;
<a title="" href="http://xxxx" >![](http://xxxx)</a>

# 图片压缩

根据设置判断上传图片是否压缩, 给出百分比.

获取图片时是否压缩, 这个需要在 Aliyun OSS 端设置, 设置好后填入对应的 styleName

# 直接提供图片压缩的功能

作用范围:

  1. 当前选中的图片;
  2. 选中的目录中的所有图片;
  3. 整个项目中的图片;

# 备份图片

图片上传完成后, 将已上传的图片按照目录备份到 当前项目的主目录

# 插件作用范围

只会解析 Markdown 文档. 如果是单个文件, 只有是 Markdown 文档才会显示 upload to Aliyun OSS, 其他时候不可用;

注意:

文件树可以多选文件

# 当前选中/正在编辑的文件

  1. 在编辑视图中直接右键 --> upload to Aliyun OSS ;
  2. 在 Tools 菜单中 --> upload to Aliyun OSS ;
  3. 在文件树选中文件后右键 --> upload to Aliyun OSS ;

# 目录

  1. 在文件树目录上点击右键 --> upload to Aliyun OSS ;

# 项目

  1. 在整个项目上点击右键 --> upload to Aliyun OSS ;

# 提示和日志

每一步给出日志

  1. 解析标签时;
  2. 拿到图片路径;
  3. 上传成功后备份图片, 不成功不备份;
  4. 替换标签;

上传过程中给出进度条

所有操作完成后给出提示!

# 设置页

  1. Aliyun OSS 设置;

-w415-w688

  1. 标签替换选项设置;
  2. 图片压缩设置 (上传前后上传后);
  3. 图床迁移设置;

# Aliyun OSS 控制台

  1. 当前存储总量
  2. 本月 Put 类请求
  3. 本月 Get 类请求

# 刷新次数

  1. 5分钟刷新一次;
  2. 打开时刷新一次;
  3. 刷新按钮;
  4. 关闭后停止刷新任务;

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK