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

Question

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.

UPDATE: the feature is currently available in VSCode Insider, and will be released in the next stable version. I will update this once that happen. See the answer below for more details.

Casaubon

There is an issue open in github if you want to upvote it there: github.com/Microsoft/vscode/issues/10121 – Soubise

Answer 1

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

---

Update 07/11/2023:

VSCode Insider has the beta version of this feature, it works very well and does what we need. According to the team it will be released with the next stable version of VSCode.

Here is the official GitHub link: https://github.com/microsoft/vscode/issues/10121#issuecomment-1790316086

To try it out, until it is released, download VSCode Insider here: https://code.visualstudio.com/insiders/

Once in use CTRL+SHIFT+P to access the actions dialogue, and select "Move Active Editor into a New Window". I suggest you bind a keyboard shortcut to it for an easy access.

Casaubon

Related to this answer: Press CTRL+SHIFT+N at any time to open a new instance of VS Code, then you can drag tabs into it. – Gaberdine

If I follow these instructions and open a new VS Code window using CTRL+K, O, then IntelliSense fails to establish references it had when the file was opened in the window, where the entire project is opened. – Alvie

in my case ctrl+k just opens search (same as ctrl + f) – Pino

@Pino do CTRL+SHIFT+P this will open the dialogue at the top, type "Open Keyboard Shortcuts" you might have fiddled with the default configuration. You can change this as you prefer and test also the combination of keys. The name of the shortcut is "Open Active File In New Window". See: code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf – Casaubon

According to the last comment on the issue, this is the number one requested feature. That comment was from late 2018, over 2 years ago now. Who's prioritizing the backlog for VS Code? I get that it might be difficult, but they could have rewritten the whole app in that time, right? – Fecundate

4 years , it's 20220607 now. New window not work for outline – About

Thank you the the updates! We finally have detachable windows now after 6 years! – Latini

Answer 2

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

That's it.

More

If you want to add more folder to the working space. => go to File then Add Folder To Workspace 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.

Danndanna

One small comment on this: "Open the command pannel ctrl+p. Then write dupl". You should write >dupl I mean > mark is important too. – Homicide

@Homicide it's my bad. It's kind of a typo (ctrl+shift+p). I'm correcting that. The thing is to open the command pallet (we can open it too with F1). In fact i knew i mad the mistake. I said i will update it. And because i had a heavy work load. I forget. Thank you a lot. It's updated now. – Danndanna

oh, it's ok. Thank you for your comment! :) – Homicide

my pleasure. Thank you too. – Danndanna

This is helpful and is a good solution to the question. – Debera

this is the best answer imho thanks! – Hominid

Best solution for now – Actinomycete

It works, BUT, the same file is not synchronized if it is opened in two different workspaces. – Ride

@Ride what do you mean by two different workspaces ? Because i generally open the project folder, then another workspace and wherever i modify the changes are reflected right away. Such change reflection is based on filesystem watch listening. vscode if my memory doesn't fail me, use chokidar for that. So there is an os limit ... You can try to set a larger file watching and related limits on your os ... and see how to optimize file watcher like chokidar or watchman, to see what things you can do. I doubt that you did touch to some vscode config. So that's my input. I wonder otherwise. – Danndanna

@Mohamed Allal, the answer suggested to use two instances of vscode, that's what I mean with two different workspaces. If I have the same file opened in the two instances, changes in one of them will not be reflected in the other. – Ride

What do you mean by two instances? In vscode here, there are windows!? The above should work perfectly. And I do use the above daily. And all works perfectly. If you have an issue you are making me curious. You can reach me at my email [email protected] and I would take a look if it works for you. – Danndanna

Answer 3

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.

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.

Target

This seems to be the only way to have both sides in sync – Fishhook

difficult if monitors are not of same resolution. – Joyann

this is the best solution I guess. – Threewheeler

It worked good on a code space on a browser, great option. – Subcontinent

Answer 4

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.

Bills

I used this approach, but is fiddly and doesn't offer the same benefits of having an independent window, such moving it left, right of the screen or minimize/maximize. – Casaubon

This is not bad (+1) but when both displays are not the same size/resolution, then the text content of a second-display part of the window can be too small/big to use. – Viddah

This solution only works if all monitors directly in-line/horizontal, and the same size/resolution. I have both a 2K and a 4K monitor of different physical sizes and at different heights -- so it simply won't work. Part of the window is either off-screen on the small monitor, or truncated on the big monitor -- neither of which are nice. – Parkin

I have 2 monitors with the same size, but on both I use Windows taskbar in the middle vertical, so unfortunately it stays on top of the VSCode window in the middle. – Zipnick

Answer 5

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.

---

And VSCode 1.85 (Nov. 2023) will include (available now in VSCode Insiders)

Floating editor windows

Run the new View: Move Active Editor into a New Window command on editors to open them in a floating window.
There are still issues, and missing features.

Borrell

I am on 1.56.2 and this is already working, the problem is that you need to first open a new instance of VSCode, and then drop the file there, meaning that the above solution is still the quickest for the first time you want to move a file in a new window (to then move this window in another screen). I it would be nice to really have a drag and drop experience (move tab), from the video (and current behaviour) it looks like is just opening the same file also int the targeted window, creating a duplicate, so not really a D&D – Casaubon

@Casaubon OK. I will check if there is any difference in 1.57. – Borrell

Unfortunately this does not work if using Remote Containers, understandably so, but I use them for all my dev work. – Graven

@JustinPhillips True. That is unfortunate. – Borrell

This seems to be the quickest/easiest method, but this (along with the "Duplicate workspace in new window" answer above) doesn't seem to keep edits to my files in sync. I type in one window and it isn't reflected in the other window (while it does stay in sync across tabs in the same window). I guess I can at least use this as view-only. – Tibbitts

Answer 6

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.

Blankly

Answer 7

For me on Ubuntu the solution was to create a project folder symlink and ope it in a new window (as it won't open the same folder in another window)

Jennee

Answer 8

Most answers are already here. I am using a SSH connection which always needs a prompt. So a new (session) window is not an option for me, i.e. I do not want to use CTRL+K & O.

---

The two best options:

For multiple tabs:

• CTRL+P > "Move Active Editor into a New Window"

For a single tab:

• Drag and Drop -> Creates a new window for the dragged tab(s)

Afterwards move the window to a the new screen or use WIN+SHIFT+Left/Right Arrows (Windows)

Being

Answer 9

Resize the window actrost multiple monitor s works great even if your primary is a different resolution this can be fixed if the secondary is on the right not so much if on the left. When on the right open a terminal or problem pane at the bottom and resize this on the right monitor to a size that works on the main and limits the cutoff on the secondary. Then open your second project file and select split right and move the split to the edge of your screen. The terminal prevents the cutoff of the working area. You can follow the same steps for the left hand side but the terminal/problem pane will be cutoff by the resolution differences. With windows 11 this is less noticeable because of built in features. I know this already a suggested answer but I am unable to comment because of my rep points are still to low

Speller