https://github.com/ideamans/vscode-image-file-paste
VS Code extension to paste images from clipboard directly into image files
https://github.com/ideamans/vscode-image-file-paste
clipboard image-processing typescript vscode-extension
Last synced: 2 months ago
JSON representation
VS Code extension to paste images from clipboard directly into image files
- Host: GitHub
- URL: https://github.com/ideamans/vscode-image-file-paste
- Owner: ideamans
- License: mit
- Created: 2025-07-05T12:47:52.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-07-06T02:48:52.000Z (12 months ago)
- Last Synced: 2025-07-06T03:35:21.676Z (12 months ago)
- Topics: clipboard, image-processing, typescript, vscode-extension
- Language: TypeScript
- Size: 1.4 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# VS Code Image Paste
English | [æĨæŦčĒ](README_ja.md)
A Visual Studio Code extension that allows you to paste images from clipboard directly into image files being edited.
## Features
- đŧī¸ **Direct Image Paste**: Paste images copied from other applications directly into open image files
- đ **Paste with Resize**: Specify width to resize while pasting (aspect ratio maintained automatically)
- đ **Automatic Format Conversion**: Automatically converts image format based on the target file extension
- âŠī¸ **Undo Support**: Undo paste operations to restore the original image
## Supported Image Formats
- PNG
- JPEG / JPG
- GIF
- WebP (with some limitations)
## Development Setup
### Prerequisites
- [Node.js](https://nodejs.org/) (v16 or higher)
- [Visual Studio Code](https://code.visualstudio.com/)
- npm or yarn
### For First-time VS Code Extension Developers
1. **Clone the repository**
```bash
git clone https://github.com/ideamans/vscode-image-file-paste.git
cd vscode-image-file-paste
```
2. **Install dependencies**
```bash
npm install
```
3. **Compile TypeScript**
```bash
npm run compile
```
## Development Guide
### Running and Debugging the Extension
1. Open this project in VS Code
2. Press `F5` or run "Run Extension" from the Debug view
3. A new VS Code window will open with the extension loaded
### Debugging Tips
- Set breakpoints: Click to the left of line numbers in TypeScript files
- Console logs: View in the Debug Console
- Errors: Check the Problems panel for TypeScript errors
### Project Structure
```
vscode-image-file-paste/
âââ src/
â âââ extension.ts # Main extension entry point
â âââ services/
â â âââ imageFilePasteService.ts # Image processing service
â â âââ imageFileHistory.ts # History management service
â âââ test/
â âââ suite/ # Test files
âââ package.json # Extension manifest
âââ tsconfig.json # TypeScript configuration
âââ README.md # This file
```
## Building and Installation
### Local Installation
1. **Package the extension**
```bash
npm install -g vsce
vsce package
```
2. **Install the generated .vsix file**
- Open VS Code
- Open Command Palette (`Ctrl+Shift+P` / `Cmd+Shift+P`)
- Select "Extensions: Install from VSIX..."
- Choose the generated .vsix file
## Usage
### Basic Paste
1. Open an image file (.png, .jpg, etc.) in VS Code
2. Copy an image from another application
3. Press `Ctrl+V` (Mac: `Cmd+V`) in VS Code
### Paste with Resize
1. Right-click on an open image file
2. Select "Paste Image with Resize"
3. Enter the new width when prompted (current width is displayed)
4. The image will be pasted with automatic aspect ratio maintenance
### Undo
Press `Ctrl+Z` (Mac: `Cmd+Z`) on an image file to undo the last paste operation.
## Running Tests
```bash
npm test
```
## Troubleshooting
### Cannot retrieve image from clipboard
- **macOS**: Should work out of the box
- **Windows**: Check PowerShell execution policy
- **Linux**: Ensure `xclip` is installed
```bash
sudo apt-get install xclip # Ubuntu/Debian
```
### Image not saving correctly
- Check file write permissions
- Ensure sufficient disk space
## Contributing
Pull requests are welcome! Please report bugs and feature requests through Issues.
## License
MIT