VSCode: Can I open individual files instead of workspaces? - visual-studio-code

Opening whole directories (each one requiring a new window) doesn’t play well with editing lots of little scripts/config files scattered in different folders.

Yes, you can! Here are three ways:
Either by running code {yourfilename here} in a terminal.
Dragging the file from a file explorer onto the open VSCode window.
Use the menu item "File/Open file... (Ctrl + O)", see image.

You don't have to open a folder in VSCode!
In VSCode create a New Window (instance) and open all the files you're interested in from anywhere on your disk.
If you want to keep this selection for later, you can Save Workspace As .. for later usage.

Related

Open Same VSCode File Buffer in Multiple Windows

Is it possible to open the same file buffer(editor) in multiple VSCode windows? This is not the same as opening the same file more than once. In the later, if you forget to save edits in one window, and then save different edits in another window, you end up with conflicts. I'm curious if it's possible to have the same buffer opened (mirrored?) in different windows, such that the view is identical for that file across all windows. So if I make changes in the file (even before saving), those changes also show in every other window that the buffer is opened in. I've searched around a lot but can't really find anything. Thanks.
Use the Split Editor command: Ctrl + \.
You can also use the icon in the top right. Hold Alt to split down.

Fast way to find Javascript source file in debugger?

RStudio uses Chrome Devtools for debugging support in its Viewer pane. (It is labelled as "RStudio Devtools", but I'm not sure to what extent it is customized besides that). You can open its window using Right-click "Inspect Element".
When developing a display that uses Javascript, the source pane in Devtools is very useful for setting breakpoints, single stepping, etc.
One thing that is fairly inconvenient is finding the line where I want to set a breakpoint. Once I have the source file open searching it is easy, but getting to the right source file is hard. Typically after I go to the source pane, I see something like this:
I know the name of the file I want to debug, but it's buried several levels below index.html in the list of files on the left. Is there a way to quickly search this hierarchy of files for a filename, so that I don't need to open all the levels down to the file I want? For example, I might want to debug htmlwidgets.js:
You'll note in the "sources" pane that, if you have no open files, you'll see a message in the middle that indicates you can type Command + P (or Ctrl + P on Windows/Linux) to open a file. When clicked, this will open a text box that will fuzzy search across the names of all source files. Type the filename there and it should be in the first results. You can navigate to it with the keyboard and select it with <Enter>/<return>, or simply clicked with the mouse.

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

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.
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
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.
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.
I found the following way to work on multiple monitors (important: they must be the same size and resolution):
open a visual studio in windowed mode on the 1st monitor (in my case it is a left monitor)
move the window to the (left) top corner
stretch window to the 2nd monitor (right) bottom corner
split screen by clicking “split editor” several times
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.
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.
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.
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)

Removing a file or folder using VS Code

When I bring up VS Code I see options for adding a file or folder but I do not see options to delete a file or folder or rename such. Any hints?
Deleting file is strait forward. To delete a folder created using MS Code explorer,
press Ctrl + Shift + P then it will show a command prompt like
section at top.
Search 'remove' in that. A command will be shown -"Workspaces: Remove folder from workspace...". Click on that.
Intended folder name will be shown for removing.
After clicking the same, it will be removed from explorer, without affecting actual
files on the operating file system.
Thank you I figured it out. It doesn't seem immediately obvious to me but on a MAC using VSCode selecting a file and entering the return key lets you rename a file, selecting a file and then using command-del deletes a file.
The Rename and Delete actions are there, but you have to select the file in the bottom part of Explorer, under the project directory. When you select it under Open Editors or right click on the tab bar, there is no Delete and that is confusing. In this case you can choose Reveal in Side bar in the tab context menu to get to that entry. But that won't help (will select the tab under Open Editors) if the file is out of the project tree, in this case the most convenient action would probably be to Open Containing Folder and delete it manually in the file manager.
Using extension:
Install File Utils extension
https://marketplace.visualstudio.com/items?itemName=sleistner.vscode-fileutils
Press Ctr + Shift + P
Type File Utils > Delete
In VSCode, make sure you are in Explorer. Also make sure you are right-clicking the file shown in the directory/folder. Here either hitting Del for windows and command+del for Mac will delete the file.
A common issue is trying to delete a file when in source control. You must be in explorer.
VSCode 1.50 (Sept 2020) still has the feature for file deletion, and improves it with microsoft/vscode issue 71315
##Should maintain row focus after deleting a file
Use case:
Use the keyboard to focus a file in the explorer and delete it
Now the whole tree has focus
Press the down arrow key
The first item is selected
I want to get back to where I was looking before.
The search tree focuses the next item in the list when one is removed.
I don't know whether the explorer did this previously with the old tree. But it would be nice for the explorer to do the same thing.
Just right click on the file or folder you will get the options to delete the file as well as of renaming the file.
For directory delete type in VScode terminal:
rm -r directoryName
For file delete type in VScode terminal:
rm fileName.tx
No way to delete a folder by a right-click. However, you may remove it from the IDE: File > Close Folder.

Multiple editor windows with multiple tabs

Very often I work with multiple projects in MATLAB and have a group of files for each project that I access at one time. Having all files of all projects open causes a lot of clutter in the workspace. One can do this for one single set of files by docking which is well known.
Is there a way to tab projects, or have multiple MATLAB editors (for each project) open with multiple tabs in each (with the projects files). The question can be found here too. In the same vein, are there other code editors which can be used to perform the same?
Project1
file 1.m
file 2.m
file 3.m
file 4.m
Project2
file 1.m
file 2.m
file 3.m
file 4.m
Either in the same window, or in different windows.
Unfortunately I don't believe MATLAB can do that kind of project/file management for you, which is why I use Sublime Text 2. It's perfect for that kind of project/file management... and not to mention the awesome shortcuts and quick editing tools to help you code faster.
Check them out: http://www.sublimetext.com/. The one drawback is that it's nagware. It is free to use, provided you can bare the popups to buy a copy of the software every now and then. Once you buy it, the popups go away. Give it a try and see how it goes!
If someone still need a solution for that-
You can just drag a tab of one file to the side, or bottom of the space of the editor, like that:
And the result will be:
Now you can drag in the same way other tabs to the new tabs group, and you have two separate tabs groups (but one Editor window..). You can of course drag the middle edge line to the right-end, and work fully only with the first group, or drag it to the left-end and work fully with the second one.
Note for one drawback here- if the line is in one of the ends, you don't see the tabs status and files names of the hidden group, and if you forget that you opened some file there and try to open it again, you will not see it opened, or any change in the IDE, because the control goes to the already opened tab but you not see it.