stefanluptak

Using VSCode on multiple monitors

Hello everybody,

usually, I use a 29" ultra-wide monitor for VSCode which can easily accomodate explorer (files panel) + file with code + file with test + integrated terminal. This all in one VSCode window.

Because of the Covid-19 situation, I am working from home with a 13" MacBook Pro + 14" portable USB-C display next to each other and I am not able to use the second display with VSCode.

Do you have some ideas, how to detach the integrated terminal from VSCode or how to use external terminal for mix test --color --trace ${file} task triggered by a keyboard shortcut for example?

I did a bit of research, and apparently, this is a known and very popoular issue. I’ve been just wondering if somebody has some workaround.

Thanks a lot.

6 comments

#vscode #vscode-elixir

1 18142 6

2021-04-16 15:44:36 UTC

Most Liked

LostKobrakai

You can move the integrated terminal to the side, but afaik not out of the main window. You can create tasks for vscode by creating .vscode/tasks.json, but assigning hotkeys to them is super unintuitive because you need to assign the hotkey the label of the task to trigger. The command for it is “workbench.action.tasks.runTask”.

{
	// See https://go.microsoft.com/fwlink/?LinkId=733558
	// for the documentation about the tasks.json format
	"version": "2.0.0",
  "tasks": [
    {
      "label": "Run build",
      "type": "shell",
      "command": "mix compile",
      "group": {
        "kind": "build",
        "isDefault": true
      },
      "presentation": {
        "reveal": "always",
        "panel": "dedicated",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning"
      ]
    },
    {
      "label": "Run tests",
      "type": "shell",
      "command": "mix test",
      "group": {
        "kind": "test",
        "isDefault": true
      },
      "presentation": {
        "reveal": "always",
        "panel": "shared",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning",
        "$mixTestFailure"
      ]
    },
    {
      "label": "Run stale tests",
      "type": "shell",
      "command": "mix test --stale",
      "group": "test",
      "presentation": {
        "reveal": "always",
        "panel": "shared",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning",
        "$mixTestFailure"
      ]
    },
    {
      "label": "Run tests (current file)",
      "type": "shell",
      "command": "mix test ${relativeFile}",
      "group": "test",
      "presentation": {
        "reveal": "always",
        "panel": "shared",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning",
        "$mixTestFailure"
      ]
    },
    {
      "label": "Run tests (current test)",
      "type": "shell",
      "command": "mix test ${relativeFile}:${lineNumber}",
      "group": "test",
      "presentation": {
        "reveal": "always",
        "panel": "shared",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning",
        "$mixTestFailure"
      ]
    },
    {
      "label": "Run coverage",
      "type": "shell",
      "command": "mix coveralls.html",
      "group": "test",
      "presentation": {
        "reveal": "always",
        "panel": "shared",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning",
        "$mixTestFailure"
      ]
    },
    {
      "label": "Run coverage (current file)",
      "type": "shell",
      "command": "mix coveralls.html ${relativeFile}",
      "group": "test",
      "presentation": {
        "reveal": "always",
        "panel": "shared",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning",
        "$mixTestFailure"
      ]
    },
    {
      "label": "Generate documentation",
      "type": "shell",
      "command": "mix docs",
      "group": "none",
      "presentation": {
        "reveal": "always",
        "panel": "dedicated",
        "focus": true
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning"
      ]
    },
    {
      "label": "Format project",
      "type": "shell",
      "command": "mix format",
      "group": "none",
      "presentation": {
        "reveal": "never",
        "panel": "dedicated"
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning"
      ]
    },
    {
      "label": "Format file",
      "type": "shell",
      "command": "mix format ${relativeFile}",
      "group": "none",
      "presentation": {
        "reveal": "never",
        "panel": "dedicated"
      },
      "problemMatcher": [
        "$mixCompileError",
        "$mixCompileWarning"
      ]
    }
  ]
}

Post #1

lucaong

I got a car pooling ride and drove to my office to take my 32’’ screen home (making sure to maintain social distancing in the process, let’s all do our part ). I had never realized how huge this screen is until I placed it on my small desk at home

Post #4

NobbZ

Because of similar issues (not as painful as yours though) my boss agreed to send me one of my offices screens, he refused though that I take it with me in the train .

Should be here tomorrow.

Perhaps you can ask your boss for similar as well, or if they try to rent a bigger screen short-term, perhaps even split cost?

Post #3

Last Post!

pitus

Same problem here (well, similar).
I’m used to Visual Studio where I use one vertical screen as an editor and the other horizontal for everything else, including side-bar explorer, properties…
With vscode I have too little space to show a wide EXPLORER / other sidebar along with the text editor on my the vertical monitor and I’d like to move the EXPLORER sidebar to the secondary monitor.
So far, I have found no way to do so.
Perhaps someone would consider implementing this feature, of dragging any panel out of vscode’s main window into another monitor as part of the same project?

Post #6