vscode创建代码截图

This post piggybacks off of the work done by who is a fellow instructor at . He shared this in the egghead Slack sometime ago and I never got around to setting this up myself.

这篇文章捎带关所做的工作的谁是老乡教练在 。 不久前，他在Slack的蛋头摊上分享了这个信息，而我却从来没有自己进行设置。

Now, I'm setting up a new laptop and decided to give it shot. Following Andy's , I'm going to walk you through the process so you can follow along.

现在，我正在安装一台新笔记本电脑，并决定要进行拍摄。 在 Andy的之后，我将引导您完成整个过程，以便您可以继续。

Before we begin, a "code profile" is essentially a different settings.json configuration. You can also customize which extensions load per code profile but that's beyond the scope of this article.

在开始之前，“代码配置文件”本质上是不同的settings.json配置。 您还可以自定义每个代码配置文件加载的扩展，但这超出了本文的范围。

1.创建一个code_profiles目录 (1. Create a code_profiles directory)

The first thing we need to do is create a place to store our "profile settings". It doesn't have to be called code_profiles, but we're going to use that term since Andy does and it sounds nice.

我们需要做的第一件事是创建一个存储“配置文件设置”的地方。 它不必称为code_profiles ，但是由于Andy会使用它，因此我们将使用该术语，听起来不错。

He keeps his at the root of his computer so we'll do the same:

他将自己放在计算机的根目录，因此我们将执行相同的操作：

# From the root of your computer ~/mkdir code_profiles

After your done, cd into that directory:

完成后， cd进入该目录：

cd code_profiles

2.创建您的第一个配置文件 (2. Create your first profile)

Since I'm going to be using this for egghead recordings, I'm going to create a new directory called egghead:

由于我将用它来记录蛋头，因此我将创建一个名为egghead的新目录：

# mkdir name-of-profilemkdir egghead

Then cd into that directory:

然后cd进入该目录：

cd egghead

3.添加您的settings.json (3. Add your settings.json)

VSCode is expecting a data directory with a User subdirectory. In there, we'll place our settings:

VSCode需要一个带有User子目录的data目录。 在这里，我们将设置：

# -p will create parent directories as neededmkdir -p data/User

After those are created, change into that new User subdirectory and create your settings.json file:

创建完这些文件后，请转到该新的User子目录并创建settings.json文件：

# Go into that directorycd data/User# Create your settings filetouch settings.json

Then open up your settings.json file and add in your settings. I'll add a modified version of what Andy :

然后打开您的settings.json文件并添加您的设置。 我将添加Andy 的内容中的修改版本：

{  "editor.tabSize": 2,  "editor.quickSuggestions": false,  "editor.parameterHints": false,  "editor.suggestOnTriggerCharacters": false,  "editor.hover": false,  "editor.fontSize": 18,  "editor.tabCompletion": true,  "window.zoomLevel": 1,  "workbench.colorTheme": "Night Owl",  "editor.cursorBlinking": "solid",  "editor.cursorStyle": "line",  "editor.minimap.renderCharacters": false,  "terminal.integrated.fontSize": 16,  "explorer.openEditors.visible": 0}

4.测试您的新代码配置文件 (4. Test your new code profile)

Now let's make sure we did everything right. Assuming you've already set up VSCode to [launch from the command line](, we can launch our new profile by running:

现在，确保我们做的一切正确。 假设您已经将VSCode设置为[从命令行启动]( ，我们可以通过以下方式启动我们的新配置文件运行：

# replace CODE_PROFILE_NAME with the profile name used earliercode --user-data-dir ~/code_profiles/CODE_PROFILE_NAME/data

And if it worked, you should see VSCode open with your settings:

如果可行，您应该会看到VSCode已打开您的设置：

5.为您的配置文件创建别名。 (5. Create an alias for your profile.)

I don't know about you, but I don't want to have to remember code --user-data-dir ... so let's take Andy's advice and create an alias.

我不了解您，但是我不想记住code --user-data-dir ...所以让我们听取Andy的建议并创建一个别名。

I'm using zsh so I'm going to add this alias to my .zshrc file like so using the keyword "teach":

我正在使用zsh所以我将使用[teach]这样的关键字将此别名添加到.zshrc文件中：

# replace CODE_PROFILE_NAME with the profile name used earlieralias teach="code --user-data-dir ~/code_profiles/CODE_PROFILE_NAME/data"

Now, when you want to use this code profile, all you have to do is type:

现在，当您要使用此代码配置文件时，只需输入：

teach ~/projects/lesson

Woohoo! And that's it.

hoo！ 就是这样。

Special thanks to for sharing this. Here's a link to his where I learned how to do this.

特别感谢分享了此信息。 这是他的的链接，我在那里学习了如何做。

NOTE: If you are using VSCode in Portable mode, there is a where the flag user-data-dir does not currently work (special thanks to @myfonj for pointing this out).

注意 ：如果在可移植模式下使用VSCode，则存在一个 ，其中该标志user-data-dir当前不起作用(特别感谢@myfonj指出了这一点)。

###

###

This post first appeared on .

该帖子首次出现在 。

? Shameless Plug: if you'd like to see more content like this, subscribe to my newsletter:

？ 无耻的插件：如果您想看到更多类似的内容，请订阅我的新闻通讯： :

翻译自:

vscode创建代码截图