Visual Studio Code - Tabs (editors) of the same project in multiple screens

Visual Studio-CodeMultiple Monitors

Visual Studio-Code Problem Overview


Using multiple screens I normally place multiple classes (files) in different screens, this helps me a lot while refactoring, checking tests and comparing changes. Visual Studio Code does not allow me to drag a tab outside the window and view it in (for example) another monitor. I checked the documentation and plugins, but the only way I found, is to open two windows, pointing to the same project (folder) and put those in different screens. I don't like this solution, that causes also some problem when I watch code changes using TypeScript.

Any suggestion?

I use Windows 10, latest version of VSCode.

Visual Studio-Code Solutions


Solution 1 - Visual Studio-Code

A solution is to press CTRL+K and after releasing CTRL, press O. This will open the current file in a new window.

There are few things I don't like about this solution:

  • Drag and Drop does not work
  • Create a new instance of VS Code resulting in (for me) 180MB of ram used
  • To open the file it takes to me few seconds (quite slow)
  • The file remains open in the original window as well

Update 20/03/2019:

There is a feature request you can track here:

https://github.com/Microsoft/vscode/issues/10121

And an explanation about why this is difficult to implement here:

https://github.com/Microsoft/vscode/issues/10121#issuecomment-345770248


Update 20/03/2019:

Another important side effect highlighted by @Mär is that:

> the IntelliSense fails to establish references it had when the file > was opened in the window, where the entire project is opened

Solution 2 - Visual Studio-Code

The easy way but with the same drawbacks. More ram and resources will be used. Is to wrap your project in a folder.

It's the best possible thing. As by now!

=> Duplicate the workspace.

Open the command pannel ctrl+shift+p or F1. Then write dupl

You'll get that enter image description here

That's it.

More

If you want to add more folder to the working space. => go to File then Add Folder To Workspace enter image description here You can add as many as you like.

 Also better more

You can open a new window (ex: ctrl+n)

And then go File > Add Folder To Workspace.

And start adding folders to your new Workspace. You can add any folder, that is already open or not. That's too way great. You can have all the needed folders for example in the second screen.

Happy coding.

Solution 3 - Visual Studio-Code

I found the following way to work on multiple monitors (important: they must be the same size and resolution):

  1. open a visual studio in windowed mode on the 1st monitor (in my case it is a left monitor)
  2. move the window to the (left) top corner
  3. stretch window to the 2nd monitor (right) bottom corner
  4. split screen by clicking “split editor” several times
  5. move the code sections separator to the edge between the monitors

This is old qestion, but such way can be useful for someone. It is not very convenient, but it works. The solution may have already appeared in the VS itself, but I didn't find it.

Solution 4 - Visual Studio-Code

A little hack I used is to just stretch the editor window to fill both screens and split the view pane between the monitors such that both screens show just one open file.

enter image description here

> This is a cheap hack that works without opening multiple instances of VSC.

It may not be the proper solution, but it works without eating up all my system memory.

Solution 5 - Visual Studio-Code

> Visual Studio Code does not allow me to drag a tab outside the window and view it in (for example) another monitor

Actually, VSCode 1.57 (May 2021, 4 years later) will propose something close:

> ## Improved editor drag and drop across windows > > Support for dragging editors to other windows was improved in this release. You can now drag diff editors, custom editors and the entire editor group to another window to open the editors there. > > Improved editor drag and drop across windows -- https://media.githubusercontent.com/media/microsoft/vscode-docs/vnext/release-notes/images/1_57/editor-dnd.gif

Solution 6 - Visual Studio-Code

My solution was to use Remote-ssh to connect to self and open in another window. This does take extra resources. But I find this comfortable as I don't need to create additional workspace.

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
QuestionNorcinoView Question on Stackoverflow
Solution 1 - Visual Studio-CodeNorcinoView Answer on Stackoverflow
Solution 2 - Visual Studio-CodeMohamed AllalView Answer on Stackoverflow
Solution 3 - Visual Studio-CodeIvanView Answer on Stackoverflow
Solution 4 - Visual Studio-Codeak_linusView Answer on Stackoverflow
Solution 5 - Visual Studio-CodeVonCView Answer on Stackoverflow
Solution 6 - Visual Studio-CodeRithvik NishadView Answer on Stackoverflow