Refactor local variable name using Visual Studio Code

Visual Studio-Code

Visual Studio-Code Problem Overview


I have this simple situation. I'd like to refactor the name of the role variable:

Enter image description here

It looks like Visual Studio Code is smart enough to know that "roles" in the URL should not be touched.

I just want to refactor the name of the variable in a single file, in a single scope, not the whole file and definitely not multiple files!

If I use Ctrl + H, it will bring me to a menu which by default refactors the name in multiple files or a whole single file, but I just want to refactor the name in a single function scope!

Visual Studio-Code Solutions


Solution 1 - Visual Studio-Code

Use rename symbol instead of the standard find/replace. Rename is bound to F2 by default.

Rename symbol will know to only touch the local roles references in your example. Visual Studio Code ships with rename support for JavaScript and TypeScript. Other languages may require installing a language extension.

Solution 2 - Visual Studio-Code

Use Rename Symbol. It is defined by default with Ctrl + F2.

However, keep in mind that the variable, definition, function, etc., that you're changing, will be changed in the file itself, not only the scope. Visual Studio Code for now doesn't have an implementation for renaming a variable in a scope (for example, a variable inside a function). So keep that in mind.

Visual Studio Code - change all occurrences

Solution 3 - Visual Studio-Code

For macOS users: Use Fn + + F2 to rename a variable inside a code block.

Solution 4 - Visual Studio-Code

To open your user and workspace settings, use the following Visual Studio Code menu command:

On Windows/Linux: Menu FilePreferencesSettings. On macOS: CodePreferencesSettings.

You can also open the Settings editor from the Command Palette (Ctrl + Shift + P) with Preferences, open Settings or use the keyboard shortcut (Ctrl + ,).

Enter image description here

In the search bar, enter keybindings.json, and add this below code:

{
  "command": "editor.action.changeAll",
  "key": "ctrl+f2",
  "when": "editorTextFocus && !editorReadonly"
}

and

{
  "command": "editor.action.rename",
  "key": "f2",
  "when": "editorHasRenameProvider && editorTextFocus && !editorReadonly"
}

In the keybindings.

F2 appears to work across all files, and Ctrl + F2 in the current file only.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAlexander MillsView Question on Stackoverflow
Solution 1 - Visual Studio-CodeMatt BiernerView Answer on Stackoverflow
Solution 2 - Visual Studio-CodeNick CuevasView Answer on Stackoverflow
Solution 3 - Visual Studio-CodeSergey NNView Answer on Stackoverflow
Solution 4 - Visual Studio-CodeKishoreView Answer on Stackoverflow