[tutorial] GitHub + PicGo + VSCode Extension

📌 Introduction

This article provides a tutorial on setting up GitHub, PicGo, and a VSCode extension to facilitate image uploading to GitHub repositories. It outlines the necessary prerequisites, the procedure to generate a GitHub token, and essential steps for configuring the PicGo extension in VSCode.

🚀 Quick Start

Before You Start

Make sure you have following:

• A Github Token with access to your repo
• A repo to store images

GitHUb

Generate GitHub Token

1. Go to Settings/Developer settings/Personal access tokens/Token (classic)
2. Click Generate new token (classic)
3. Set a name for the token to identify it easily and choose No expiration
4. Select the required scopes for the token

Set Up Repo

To ensure your images are accessible, set your repo to public.

VScode Extension

1. Install PicGo extension in VScode
2. Set Pic Bed: Current to github
3. Set Pic Bed > Github: Repo to your previously created public repo. Format is {username}/{repo_name}
4. Set Pic Bed: Uploader to github
5. Set Pic Bed > Github: Branch to the branch of your public repo
6. Set Pic Bed > Github: Path (Optional). If you want to store images in specific folder (e.g. images). Make sure to include a trailing slash (/), otherwise, it will be used as a prefix for image names
7. Set Pic Bed > Github: Token to the Github token you created earlier

Troubleshooting

If you see the following error, it means xclip is not installed:

PicGo: xclip not found! Please install xclip before run picgo.

To fix this, install xclip using the following command:

sudo apt install xclip

🔁 Recap

• You need a Github token and a public repository for image storage.
• Install the PicGo extension in VSCode for image uploading.
• Follow specific configuration steps in the PicGo extension to link it with GitHub.
• Potential troubleshooting includes ensuring xclip is installed on your system.