Vscode: Ability to escape $ and { characters in snippets

[wmaurer]

Snippets use the ${} syntax, but this is also valid Javascript/Typescript syntax for string interpolation, and this can create a conflict.

For example, I've defined a snippet as follows:

"rxjs .do(x => console.log(`${JSON.stringify()}`))": {
    "prefix": "rxdoj",
    "body": [
        ".do(x => console.log(`${JSON.stringify($1)}`))"
    ],
    "description": "rxjs .do(x => console.log(`${JSON.stringify()}`))"
}

I would like initial cursor position to be where the $1 is, but due to the conflicting syntax between snippets and Typescript, I get:

 .do(x => console.log(`JSON.stringify()`))

... with the entire backticked string as the selection.

My suggestion would be to able to escape a $ symbol using $$, which would signal to the snippet logic that this is not a placeholder (I tried this but it doesn't work correctly - the curly braces are still missing).

[bpasero]

I think this is possible @alexandrudima ?

[alexdima]

@wmaurer You can escape the { and }:

"rxjs .do(x => console.log(`${JSON.stringify()}`))": {
    "prefix": "rxdoj",
    "body": [
        ".do(x => console.log(`$\\{JSON.stringify($1)\\}`))"
    ],
    "description": "rxjs .do(x => console.log(`${JSON.stringify()}`))"
}

[wmaurer]

@alexandrudima Thanks a lot! In the documentation, I haven't been able to find the fact that you can escape { and } ...

[alexdima]

@wmaurer Good point. I have pushed Microsoft/vscode-docs@55ba3bbbd942b53b75b7ca7edfe95ff228c99844 to document how to escape { and }.

[wmaurer]

@alexandrudima Great, thanks.

[cbstodd]

So I'm trying to create a simple string interpolation snippet as @alexandrudima suggested, but I'm getting an extra \ with my snippet:

"Interpolation": { "prefix": "int", "body": [ "$\\{$1\\}" ] }

so my output is:
$\{} when I want it to be ${}

[Neophius]

Move the first backslashes to before the $.

[MattGoldwater]

@Neophius Why does it work this way? Based on what I know of escape characters I would've expected to see 1 backslash before and after the { and }. Is this a JSON thing?