Instantly open files when navigating the file explorer with arrow keys in VScode

Question

Currently, I navigate the file tree in VScode with arrow keys and have to press Cmd + Down to display the file in the editor.

Is there any way to navigate through the file explorer in VScode AND instantly open the file upon focus/highlight without shortcut ? (similarly to how it works in sublime text)

Answer 1

Goal: Glance review a lot files in project via Explorer view of VS Code.

Here is a bit long (but easy to follow) procedure - Once done, you will save a lot of time later.

---

1 . Install multi-command extension

https://marketplace.visualstudio.com/items?itemName=ryuta46.multi-command

2 . Menu > File > Preferences > Settings
or, Ctrl + ,

3 . Click on "Open settings (JSON)" button on top-right

4 . Paste below:

  "multiCommand.commands": [
    {
      "command": "multiCommand.navigateExplorerDownAndPreviewFile",
      "sequence": ["list.focusDown", "filesExplorer.openFilePreserveFocus"]
    },
    {
      "command": "multiCommand.navigateExplorerUpAndPreviewFile",
      "sequence": ["list.focusUp", "filesExplorer.openFilePreserveFocus"]
    }
  ],

5 . Menu > File > Preferences > Keyboard shortcuts
or, Ctrl K + Ctrl S

6 . Click on Open Keyboard Shortcuts JSON button on top-right

7 . Paste below two entries, into your array

[
    {
        "key": "down",
        "command": "multiCommand.navigateExplorerDownAndPreviewFile",
        "when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && listFocus && !inputFocus"
    },
    {
        "key": "up",
        "command": "multiCommand.navigateExplorerUpAndPreviewFile",
        "when": "explorerViewletVisible && filesExplorerFocus && !explorerResourceIsRoot && !explorerResourceReadonly && listFocus && !inputFocus"
    }
]

8 . Menu > View > Explorer
or, Ctrl Shift E

9 . Select any file on left side in explorer

You can open a folder that has multiple files (for example, .js files)

10 . Try below keyboard shortcuts to open next/previous file

• Press up arrow to go to previous file, and view it in the middle pane
• Press down arrow to go to next file, and view it in the middle pane

---

Now, you are setup to preview files using only up & down arrow keys, via explorer in vs code.

Answer 2

As written in this github issue: (Open File Preview when using Keyboard navigation in Explorer for better accessibility. #55816), as of (at least) the 28th of august 2019 it is possible to

preview files, by selecting them in the explorer with Up/Down and pressing space

One can easily switch to the file-explorer with shift+cmd+E. This is not as simple as just the arrow-keys, but still way more convenient than what is described in the question.