Link Replacement with Regex in VS Code

vscode-link-replacement-using-regex.md

Link Replacement with Regex in VS Code

Introduction:

This Gist provides a step-by-step guide on using regular expressions (Regex) in Visual Studio Code (VS Code) to efficiently replace specific parts of URLs in multiple files. It is particularly useful for scenarios where parts of the URLs vary, such as filename changes or version numbers in Cloudinary links.

Use Case:

• You have multiple files containing Cloudinary URLs.
• You need to replace these URLs with new URLs from a different domain.
• The original URLs contain variable segments like version numbers and unique file identifiers.

Solution:

A Regex pattern and a corresponding replacement pattern are used in VS Code's search and replace feature to target and modify specific parts of each URL.

Regex Pattern:

• Find: https:\/\/res\.cloudinary\.com\/dcuv7j5b8\/video\/upload\/v\d+\/([\w-]+)\/([\w-]+)_[\w-]+\.mp4
• Replace: https://fronttips.ams3.cdn.digitaloceanspaces.com/$1/$2.mp4

Explanation:

• The Regex pattern captures the necessary parts of the original URL and ignores variable segments like version numbers and suffixes after filenames.
• The replace pattern constructs the new URL using captured groups from the original URL, ensuring consistency and accuracy in the replacement process.

How to Use:

1. Open the search panel in VS Code.
2. Enable regex search by clicking the .* icon.
3. Enter the provided Regex pattern in the Find field.
4. Enter the replacement pattern in the Replace field.
5. Execute 'Replace All' after confirming the pattern works as expected with a few test cases.

Video Demo of the Tip

https://front.tips/vscode-link-replacement-using-regex/