🌐 Available in other languages: Polski | 中文 | 日本語 | Deutsch | Français | Español | Русский | Português | Bahasa Indonesia | 한국어
A Visual Studio Code extension that helps you easily switch all paths in a file (HTML, CSS, JS, images, etc.) between relative paths
- 🔁 Automatically toggles between relative and absolute paths.
- 💡 Supports paths in:
<script src="..."><link href="..."><img src="...">url("...")inside CSS
- ⚡ Triggered via keyboard shortcut.
- 🧭 Changes all paths in a file at once.
- Minimum version: 1.85.0
- Tested on Windows, macOS, and Linux.
- Open Visual Studio Code.
- Go to the Extensions view (
Ctrl+Shift+X). - Search for
Path Switcher. - Click Install.
- Clone this repository:
git clone [clone https://github.com/fatonyahmadfauzi/Path-Switcher.git](https://github.com/fatonyahmadfauzi/Path-Switcher.git) cd Path Switcher npm install - Open the folder in VS Code.
- Press F5 to launch the Extension Development Host.
| Command Name | Command ID | Shortcut |
|---|---|---|
| Toggle Relative |
path-switcher.togglePath |
Ctrl + Alt + P |
Before:
<script src="js/meta-update.js"></script>
<link rel="stylesheet" href="css/style.css" />
<img src="assets/logo.png" />After (Absolute):
<script src="/js/meta-update.js"></script>
<link rel="stylesheet" href="/css/style.css" />
<img src="/assets/logo.png" />After (Relative):
<script src="js/meta-update.js"></script>
<link rel="stylesheet" href="css/style.css" />
<img src="assets/logo.png" />Compile TypeScript:
npm run compileLint code:
npm run lintRun tests:
npm test- Fork the repository.
- Run
npm installto install dependencies. - Make your changes.
- Compile TypeScript:
npm run compile. - Test in VS Code (press F5 → Extension Development Host).
- Submit a Pull Request.
Report issues on the GitHub Issues page.
See all notable changes for each version in the CHANGELOG.md file.
📦 You can also view release notes directly on the GitHub Releases page.
MIT License © Fatony Ahmad Fauzi