CODEWITHSUNDEEP
regexreplacevisual-studio-code
vesperknight
vesperknight

Reputation: 770

vscode regex find/replace replace characters inside string

I want to replace all instances of

() => import('@/components/something/Something')

with

() => import(/* webpackChunkName: "components--something--Something" */ '@/components/something/Something')

So far I have this find/replace regex

Find: \(\) => import\('(.+?)'\)

Replace: () => import(/* webpackChunkName: "$1" */ '$1')

Which replaces:

() => import('@/components/something/Something')

with

() => import(/* webpackChunkName: "@/components/something/Something" */ '@/components/something/Something')

My problem is that I don't know how to replace the "@" and "/" characters

Do I need to execute two find/replace queries or can it be done with a single one? I want to remove the "@" entirely and replace the "/" by "--"

Any help much appreciated!

Thanks

Upvotes: 3

Views: 3133

Answers (2)

Casimir et Hippolyte
Casimir et Hippolyte

Reputation: 89557

With two find/replace:

find: (\(\) => import\()'@/([^']*)'\)
replace: $1/* webpackChunkName: "$2" */  '@/$2')

demo

and

find: ((?:\G(?!^)|\(\) => import\(/\*)[^/*]*)/
replace: $1--

demo

Upvotes: 3

JDB
JDB

Reputation: 25810

If the path always matches the @/part1/part2/part3 pattern, then you could group those parts individually and use your backreferences like so:

Find:

\(\) => import\('(@/(.+?)/(.+?)/(.+?))'\)

Replace:

() => import(/* webpackChunkName: "$2--$3--$4" */ '$1')

However, if the number of path parts varies (which is more likely) then you're best bet is probably a second and third set of find and replaces along these lines:

Get rid of the @/

Find:

(?<=\(\) => import\(/\* webpackChunkName: ")@/

Replace:

(Replace with nothing)

Convert / to --

Find:

(?<=\(\) => import\(/\* webpackChunkName: ")(.*?)/(.*?)(?=" \*/)

Replace:

$1--$2

(You'll have to run this several times per line)

Upvotes: 0

Related Questions