vscode安装与配置

7,576 阅读9分钟

专栏指引

专栏指引

序言

目的: 为了修改vscode安装扩展安装路径,使其放置到目标路径。修改vscode的默认缓存工作区位置,缓解C盘压力

vscode相关网站

vscode官网code.visualstudio.com/

1.下载安装包

vscode官网上下载安装包code.visualstudio.com/

2.安装

2.1.双击运行安装exe,进行安装

image.png

2.2.协议许可

点击“我同意此协议”后,下一步 image.png

2.3.选择安装目录

image.png

2.4.选择开始菜单文件夹

默认 image.png

2.5.选择附加任务

我一般是全选,下一步

image.png

2.6.准备安装

下一步

image.png

2.7.安装中

image.png

2.8.安装完成

image.png

3.修改扩展安装文件夹

安装后,默认扩展安装的位置在这里(C盘用户.vscode文件夹)。

3.1 方式1:修改快捷方式的目标属性(不推荐)

网上一般会建议直接修改快捷方式的目标属性来修改,这样的缺点时,在文件夹右键以vscode打开时,已经安装的扩展会失效,所以正确的应该使用mklink软连接来更改。

以下演示网上常用的方式修改,后面会有使用mklink方式的介绍。

打开vscode的属性,在目标位置追加输入code --exensions-dir 存放路径,我的是输入这个

code --extensions-dir "D:\vscode\extensions"

全路径为:

D:\vscode\Code.exe code --extensions-dir "D:\vscode\extensions"

修改后重启vscode,此时,因为我们以这个方式修改的时候,生效的只是通过双击这个快捷方式进去后安装的扩展才会在我们指定的目录路径里,通过其他方式打开的vscode安装的不生效或者已安装的扩展不生效。可以自行测试。

3.2 方式1:使用mklink方式修改(推荐)

写在前面的话:如果以安装很多的扩展,请先把扩展剪切到存放的目标路径下在进行接下来的操作。

3.2.0 新建目标文件夹

这一步是必须的!!!!必须要存在目标路径 在你需要存放vscode扩展的目录新建存放路径 例如,以下是我的目标路径,由于我是想把扩展和vscode的安装文件放在一起 在vscode安装目录下新建extensions文件夹 image.png

3.2.1 打开vscode默认安装扩展的路径

一般默认扩展安装路径是在C盘用户文件夹里的.vscode里 image.png

3.2.2 移除默认安装扩展目录下的extensions文件夹

必须要移除或删除默认的vscode的扩展存放文件夹 image.png

3.2.3 新建目标文件夹

我是想把扩展和软件安装目录放一起。这一步是重复了,为了提醒你们记得建好目标文件夹

image.png

3.2.4 管理员身份运行cmd执行mklink命令

3.2.4.1.管理员身份运行cmd

image.png

3.2.4.2.执行mklink

命令规则

mklink /目标盘 "需要被软连接的路径如vscode默认存放扩展的路径" "目标路径"
  • 目标盘如果不存在,可以随意先设置为已经存在的磁盘,一般电脑是默认有C、D两个盘,而有一些是我们后面加装内存条建立出来的新磁盘,mklink是不识别的,例如你把扩展安装在G盘,那么你的命令行可以这样:“mklink /D "vscode默认存放扩展的路径" "在G盘的目标路径"”
  • 要被软连接的路径必须是不存在的,因为mklink在创建软连接时会重新创建类似快捷方式样式的路径文件夹,所以要被软连接的路径必须是不存在的,例如我们需要把默认的vscode存放扩展的路径文件夹删除
  • 目标路径必须是存在的,mklink不会帮我们自动创建目标文件夹,所以必须要我们在执行mklink之前就需要创建好

以下是我拼接好的命令,请修改用户名GXN为你们的计算机当前运行的计算机名

mklink /D "C:\Users\GXN\.vscode\extensions" "D:\vscode\extensions"

image.png

image.png

指行以上命令后,你会发现在原来的默认扩展安装路径中,新增了extensions的快捷方式,目标指向了我们刚才设置的目标。这样就可以了,可以进行下一步测试了。

image.png

如果以上你不清除C盘下vscode的默认安装路径,你就会得到如下提示:“当文件已存在时,无法创建该文件”,这时,你应该先移除默认安装扩展目录下的extensions文件夹再行操作。如果你执行命令成功后,已创建了extensions快捷方式,再次运行命令,也会得到同样的结果。请看后面关于此命令的mklink解释 image.png

3.2.4.3.测试

安装一个扩展,例如chinese简体中文。使用右键菜单打开或者双击快捷方式打开需要打开的文件夹。看看界面是否都是中文,如果是,证明成功了。我就省略啦。

3.2.4.4.mklink命令解释

命令解释

mklink /D "C:\Users\GXN\.vscode\extensions" "D:\vscode\extensions"

意思是,在目录C:\Users\GXN\.vscode 创建一个快捷方式extensions,此快捷方式指向(目标地址为)D:\vscode\extensions

更多的mklink详解可以看另外的博主的文章:blog.csdn.net/debrnr/arti…

4. 关闭vscode自动更新

打开vscode,【文件】-》【首选项】-》【设置】

image.png

在搜索框输入自动更新,找到Update:Mode(一般是在搜索结果的第一项),把选项值改为node,重启即可生效

image.png

5.修改工作缓存区

vscode默认的缓存区是在C:\Users\{用户}\AppData\Roaming\Code\User\workspaceStorage, 拿我的举例,我的就是在C:\Users\GXN\AppData\Roaming\Code\User\workspaceStorage

image.png

修改缓存区有两种情况,一般的情况是修改默认的缓存工作区,就是我们一般ctrl+s进行保存时,如果没有把项目工作区另存为,那么就会默认缓存到工作区。先说另存为工作区的。

5.1 另存为工作区

操作

在需要另存工作区的项目使用vscode打开 找到【文件】-》【将工作区另存为】

image.png

选择当前项目缓存的工作区位置即可。

例如:我打开这个测试项目,然后另存工作区为当前项目根路径下

image.png

工作区文件夹名后缀默认格式为:vscode当前打开根文件夹名.code-workspace,例如我目前打开的项目根目录名为uni-app-map-masker-test,另存工作区的json文件名默认为uni-app-map-masker-test.code-workspace

image.png

,请另存为后,我们可以找到vscode默认缓存文件夹里的缓存区,以下是我的对应的文件缓存区。发现缓存workspace.json的workspace属性是已经改为我们的目标路径了。

image.png

image.png

没有更改过缓存区的项目缓存文件workspace.json的workspace属性指向是指向默认的vscode缓存路径的。

image.png

后续不要随意更改这个json文件名,如果你要更改的话,请找到vscode工作区,找到缓存文件夹修改workspace.json的workspace属性。

优点

可以对单一的项目进行单独的缓存工作区

缺点

这个方式只是针对与单个项目而言,并不能做到全部由vscode打开的文件都缓存。这个另存工作区的方式,可以发现,我们在C盘还是有对应的一些目录缓存的。

5.2 修改快捷方式目标路径追加--user-data-dir "目标缓存的路径"

操作

打开快捷方式属性,在它的目标属性后追加 如下格式的命令

--user-data-dir "目标缓存的路径"

例如,我把工作区放到vscode的安装路径下,我的命令行为:

--user-data-dir "D:\vscode\workspace"

然后修改后点”应用“后点击”确认“ image.png

优点

针对于所有使用此快捷方式打开的文件,缓存区都默认为命令中的目标缓存路径 --user-data-dir "目标缓存的路径"

缺点

就是必须由此快捷方式打开的文件的才能生效。这个和设置扩展也是一样的道理

5.3 使用mklink创建快捷方式指向目标路径

操作

与扩展的操作方式大同小异 首先,请确保把默认缓存工作区的文件都迁移到目标路径下再进行以下操作,这里我就快速过。

1.迁移工作区的文件到目标路径下

vscode默认的缓存区是在C:\Users\{用户}\AppData\Roaming\Code\User\workspaceStorage

拿我的举例,我的就是在C:\Users\GXN\AppData\Roaming\Code\User\workspaceStorage

把这个vscode的默认缓存区剪切到目标路径下,举例为我的操作,我是想把工作区都放到vscode的安装路径下。我的安装路径在D:vscode。

image.png

迁移后的默认缓存区如下,(已经没有workspaceStorage文件夹),请确保默认C:\Users\{用户}\AppData\Roaming\Code\User\下没有workspaceStorage文件夹

image.png

2.执行mklink命令

命令规则

mklink /目标盘 "vscode默认缓存路径" "目标路径"

以下是我拼接好的命令,请修改用户名GXN为你们的计算机当前运行的计算机名

mklink /D "C:\Users\GXN\AppData\Roaming\Code\User\workspaceStorage" "D:\vscode\workspaceStorage"

使用管理员身份运行cmd,输入以上拼接好的命令

image.png

以上成功,不成功的请注意步骤,可参考修改安装扩展路径使用的mklink的解释。 修改成功后,可以看到,在vscode的默认缓存区有快捷方式指向我们刚才设置的路径

image.png

测试就自行测试啦。我随便打开vscode,它都把缓存放到我刚才设置的路径下

image.png

优点

无论使用什么打开方式打开,vscode的默认缓存地址都是指向我们设置的地址。而且不会有什么乱七八糟的缓存工作区在C盘

缺点

你问我缺点????我觉得yyds。mklink就是好呀,缺点就是重装系统或者更换计算机用户后,相关的C盘软连接将失效

专栏指引