vscode/typora+picGo-core(命令行CLI)/picGo(GUI)+图片上传(github/smms)/批量上传/typora语法扩展渲染功能设置/修改本地图片存放位置配置

文章目录

• typora&vscode 性能对比(渲染速度)
• picgo_GUI中文环境
• • GUI data.json 总体配置文件
• 命令行任意环境
• • 安装picgo-commandLine
  • 配置文件和命令行详解(official docs)
  • • smms部分的配置
    • github部分的配置
    • • 安装gitee插件并测试上传
      • 测试gitee
• typora+picgo-commandline
• • 下载picgo.exe
  • 变通方法
  • • • 查看命令行picgo工具的使用
• typora语法扩展功能设置(渲染)
• typora image选项(推荐配置)
• • 修改本地图片存放位置
  • upload image(插入图片时自动上传)
  • 批量上传
  • vscode+picgoConfig
  • • 📚 Documentation

typora&vscode 性能对比(渲染速度)

• 目前已知typora比较耗费计算机资源,对于含有大量公式的markdown文件,在省电模式下浏览时明显卡顿
• 而vscode在渲染markdown时明显要更加快速,对计算机资源要求较低

picgo_GUI中文环境

• 在中文环境下,您可以使用PicGo(app)
• 且仅在软件语言设置位中文,并重启软件后才可以看到该选项
• 这种方式直接调用GUI板的picgo进行上传操作,比较直观
  

GUI data.json 总体配置文件

命令行任意环境

安装picgo-commandLine

• 为了通用性,我是通过单独安装picgo commandLine 来提供全局服务
• 建议使用npm来安装(使用yarn安装后似乎无法直接启动)

配置文件和命令行详解(official docs)

• 配置文件 | PicGo-Core
• CLI命令 | PicGo-Core

---

smms部分的配置

• 可以使用命令行配置
• picgo set uploader
  • 

github部分的配置

• 我的配置
• (gitee
• 
• 配置文件变化
  

安装gitee插件并测试上传

测试gitee

• (如果没有gitee插件,picgo将无法上传到gitee,会被重新设定位smms:[PicGo WARN]: Can't find uploader - smms, switch to default uploader - smms)
• 安装插件后,测试上传剪切板中的图片:

安装命令
- picgo install gitee-uploader
-

• 上传指定目录的图片

  • 

• 查看命令行使用说明picgo -h

 
PS D:\exes> picgo -h
Usage: picgo [options] [command]
 
Options:
 -v, --version                        output the version number
 -d, --debug                          debug mode
 -s, --silent                         silent mode
 -c, --config <path>                  set config path
 -p, --proxy <url>                    set proxy for uploading
 -h, --help                           display help for command
 
Commands:
 install|add [options] <plugins...>   install picgo plugin
 uninstall|rm <plugins...>            uninstall picgo plugin
 update [options] <plugins...>        update picgo plugin
 set|config <module> [name]           configure config of picgo modules
 upload|u [input...]                  upload, go go go
 use [module]                         use modules of picgo
 init [options] <template> [project]  create picgo plugin's development templates
 help [command]                       display help for command
 
 
 

typora+picgo-commandline

• typora 默认行为:nul &cmd /d/s/c
• picgo.exe(download by typora)存放位置:
  

下载picgo.exe

• 现在可能下载不下来了
• 可能需要魔法加持/第三方来源(node.js)
  

变通方法

typora提供的picgo.exe下载不太理想,我们可以通过自定义command

• 首先下载号命令行的picgo(基于node.js)

• 检查安装情况

• 

• 

• 将带有.cmd后缀的那一条整条路径复制备用

查看命令行picgo工具的使用

发现我们可以使用update或者简写u来实现上传
D:\exes\node-v16.13.0-win-x64\picgo.cmd
upload

• 最终得到类似于:D:\exes\node-v16.13.0-win-x64\picgo.cmd upload 的命令
• 将其复制到typora
• 
• 应该就可以正常使用

typora语法扩展功能设置(渲染)

typora image选项(推荐配置)

修改本地图片存放位置

upload image(插入图片时自动上传)

批量上传

• 将本地图片全部上传
  

vscode+picgoConfig

• vscode中有一款插件:vscode all markdown
  • vscode all markdown - Visual Studio Marketplace
  • 不过github和smms都是可以使用的

📚 Documentation

• Image Upload
  • Usage

1. Set "vscode-md.image.pathType": "picgo" .

   • 

2. Create config file for picgo:

• 根据使用的图床平台提供的密钥来填写
• 保存为一个单独的文件
• 将该文件的目录复制下来,备用

{
  "picBed": {
    "uploader": "smms",
    "smms": {
      "toke n": "token of smms"
    }
  }
}

• This example uses smms as a place to store pictures. You need to log in sm.ms and get a token from the dashboard.

• In addition, you can also use Github, Imgur, Qiniu Cloud, Tencent Cloud COS, Upyun Cloud, Aliyun OSS

3. Set vscode-md.picgo.configPath:

   • 将复制的路径粘贴于此(注意要包括目录+文件名.json)
     

4. Reopen your vscode file
   - 重启vscode后会检查路径是否正确
   - 但是内容还是要仔细填写,以免上传不成功

• Shortcut key