I’m participating in nuggets Creators Camp # 4, click here to learn more and learn together!

Why use VSCode workspace

As the first editor in the universe (I picked it myself), VSCode is not only a great tool for front-end development, but also a great experience for Python development and c/ CPP development. Some people even write Java in VSCode. Vscode is not an IDE and many of its features are not integrated, but vscode has very good extensibility and its strong community provides an extension market. Users are free to install extensions according to their needs, making vscode very lightweight and fast, which is why many people like it.

But as vscode expands, it becomes very difficult to manage, for example: Front-end developer, I’m doing so our python plug-ins do not need to, we can choose to open, but this plugin will obviously take up unnecessary CPU resources, most people will choose to shut down, and use it every time you open again, actually this is not a good way, it’s just a plug-in, but python development plug-in can be more than one, And there are c/ CPP plug-ins to manage, which can become very troublesome.

This is where the VSCode workspace was born. One of the great advantages of workspaces is that you can create custom workspaces, such as Python as one workspace, CPP as one workspace, front-end development can be divided into several workspaces as needed, and you can control whether extensions are enabled or disabled in the workspace.

Take a look at the end result:

Workspace creation

Create a workspace

We first opened the React folder, clicked the file in the menu bar, and saved the workspace as create workspace. Then the file of.code-workspace will be generated, and the name can be customized. It is suggested to create a folder for storing these files. You can see the React folder.

Add a project to the workspace

One of the advantages of a workspace is that you can open multiple projects in your workspace and add or remove them as you want.

Enable or disable extensions in the workspace

The point is, with workspaces, you can turn on or off extensions in your workspace as needed, which I think is one of the best features, not only to reduce unnecessary memory footprint, but also to prevent other irrelevant plug-ins from affecting development, especially snippets.

My recommendation is to enable only some common plugins, such as Chinese (Simplified), and some targeted plugins will only be enabled in the workspace.

Switching workspaces

Switching workspaces is also simple, opening workspaces from files in the menu bar.

Workspace configuration

If the workspace is not enabled, we have only user and folder (.vscode) level Settings. With the workspace enabled, a new workspace setting is added, where we can write related Settings and debug configurations.

Many people will be confused by these levels of configuration at first, but it is easy to understand. The relationship between the three is very much like CSS inheritance and weight. The weight of users is the lowest and the scope of action is large. Folder has the highest weight and small scope, and the three have an inheritance relationship.

For example, if you do not write workspace Settings, you will inherit the user’s Settings, so you only need to write different Settings in the workspace, which will overwrite the user’s Settings.

graph LR; A (user) -- - > | | B inheritance (workspace) B (workspace) - - - > A (user) B (workspace) -- - > | | C inheritance (folder) C (folder) - - - > B (workspace)

Project Manager

After the above configuration, it is already relatively easy to use, but not powerful enough, a little bit of trouble to operate, next we go to install an extension, this extension and the VSCode workspace is a perfect match, super easy to use.

The installation volume of this extension is also quite high. The last update date is 2022/2/9, indicating that it is being actively maintained and the score is all five stars.

Once installed, a folder icon will appear in the left menu.

The React workspace plugin makes it easy to switch workspaces. It also provides some functionality for tagging, as well as remote projects, but we’ll just cover workart-related issues.

We can also see that vscode can keep files open when switching workspaces, even folder collapses and opens, which greatly improves our development efficiency. It also saves not only workspaces but also folders, which is highly recommended even if you don’t use workspaces.

The last

Thank you for reading this article. I hope it was helpful. If you have any questions, please feel free to discuss them in the comments section ❤️❤️.