尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

VS Code安装与汉化全攻略:从下载到中文界面配置与常见问题排查

VS Code安装与汉化全攻略:从下载到中文界面配置与常见问题排查 先说个真实场景。上个月帮一个刚转行的朋友远程配环境他从官网下了 VS Code双击一路 Next 装完打开发现界面全是英文捣鼓了半小时也没弄成中文最后问我是不是要重新下载一个中文版。这个问题其实特别典型——VS Code 本身没有中文版这个概念它只有一个安装包界面语言靠的是语言包扩展和配置项切换。很多人卡在这个点上不是因为操作多难而是没人把安装 汉化这条链路完整讲透。这篇记录就是干这个的从下载渠道、Windows 安装选项、中文语言包配置到装完后的基础调校和几个高频报错排查全部按我实际操作的顺序走一遍。适合完全没装过 VS Code 的新手也适合那些装了但没配好中文、还有很多疑问的人。如果你已经会装、会切换中文可以直接跳到第 5 节看报错排查那部分是平时最容易被忽略、也最容易卡住人的地方。1. 开装之前先把版本、渠道和系统底子确认好1.1 User 版还是 System 版大多数人没注意的第一个岔路口VS Code 官网下载页code.visualstudio.com默认给的是 User Installer很多人根本没注意到还有 System Installer 的选项。这两者的区别不只是安装路径还牵扯到权限、更新方式和适用场景。对比项User Installer用户版System Installer系统版安装位置C:\Users\你的用户名\AppData\Local\Programs\Microsoft VS CodeC:\Program Files\Microsoft VS Code是否需要管理员权限不需要需要自动更新更顺畅偶尔会因权限不足更新失败适用场景单机个人使用、非管理员账号给多用户共用、配合企业统一管理策略我的建议很直接个人电脑默认用 User 版就够了。它不需要管理员权限更新也不会像系统版那样频繁报权限不够的错。如果你是企业 IT要给一批机器统一下发那才考虑 System 版或者离线安装包。还有一个容易被忽略的坑不要在同一台机器上同时装 User 版和 System 版。两个版本共用同一份用户数据目录%APPDATA%\Code但程序文件和扩展的加载路径不一样装在一起很容易出现明明装了扩展却加载不出来的诡异问题。1.2 下载渠道官网、微软商店和离线包怎么选官网是最直接的渠道打开 code.visualstudio.com 后点页面里的 Download 即可。需要注意的是下载页有 Stable 和 Insider 两个标签页Stable 是正式版绝大多数人用这个Insider 是预览版功能更新更快但偶尔会有异常出错的情况不建议新手上手就用。如果官网页面打开比较慢这种情况在某些网络环境下挺常见可以考虑微软商店版本。在微软商店搜索 Visual Studio Code安装的是同一个软件好处是后续更新由商店统一推送。唯一要注意的是商店版和官网版会产生不同的安装实例尽量二选一不要混装。团队内部或内网环境下建议直接下载离线安装包拷到目标机器上双击安装省去在线下载的时间。离线包也在官网下载页选 System Installer 或对应架构的版本即可。下载前先确认系统架构。Windows 10/11 基本都是 x64少数 ARM 设备要注意选对应的包。怎么看右键此电脑→属性看系统类型那行写的是 x64 还是 ARM64照着选就行。提示VS Code 从 1.70 版本之后就停止支持 Windows 7/8 了。如果还在用老系统要么装旧版本不推荐安全性和功能都跟不上要么尽早升级系统。1.3 安装前要确认的系统条件VS Code 本身是轻量编辑器安装包也就一百多 MB对硬件几乎没要求。但如果你的目标是要跟着各种教程做 Python、C/C、前端开发那安装前务必确认三件事。第一账号权限。User 版安装不需要管理员但后面装需要编译的扩展比如 C/C 插件调用编译器或者写系统级环境变量时还是会遇到权限弹窗。提前知道自己电脑的管理员账号密码能省不少事。第二磁盘空间。编辑器本身不大但扩展、缓存和将来项目的依赖node_modules 这种会慢慢涨C 盘至少留出 5 到 10GB 的空余比较稳妥。第三已有的开发环境。如果你已经装了 Python、Git、Node.js安装前在命令行里分别执行python --version、git --version、node -v确认它们都正常输出版本号。这一步很关键VS Code 本身不会帮你装任何语言运行时它只是壳后面能不能跑代码完全取决于这些底座是否就绪。2. Windows 安装全程从双击 exe 到命令行接管2.1 安装向导里的每个勾选项到底有什么用双击下载好的安装包前面的步骤很简单同意协议、选择目录。真正让人犹豫的是选择附加任务这一步的复选框。我用一张表把每项的实际作用说清楚。勾选项实际作用我的建议创建桌面快捷方式在桌面生成图标建议勾上将通过 Code 打开操作添加到文件和目录上下文菜单右键任意文件/文件夹时出现通过 Code 打开强烈建议勾上日常效率提升明显将 code 命令添加到 PATH命令行里能直接输入 code 启动 VS Code强烈建议勾上开项目全靠它将 VS Code 注册为受支持文件类型的默认编辑器双击 .txt、.md、.json 等文件默认用 VS Code 打开新手可以先勾上很多教程对这些只字不提直接让你一路 Next。但实操中没勾添加到 PATH的话后面你在命令行输入code .会提示code 不是内部或外部命令然后又要回头折腾环境变量。所以我的默认答案是四项全勾尤其是 PATH 和上下文菜单。2.2 安装目录、用户数据目录和卸载残留默认安装目录在用户目录下的 AppData\Local\Programs\Microsoft VS Code这里纯粹放程序文件。真正存放个人数据的是另外两个地方用户设置和缓存%APPDATA%\Code设置、缓存、日志都在这里扩展%USERPROFILE%.vscode\extensions所有扩展文件都在这里)理解这两个目录相当重要。以后遇到设置怎么丢了明明装了扩展却看不到这类问题基本都是来这里查的。有次我遇到扩展全消失就是因为 .vscode 目录被清理工具误删了重新同步一次才恢复。卸载 VS Code 时默认流程只删程序文件用户数据和扩展会留在原地。如果你想彻底重装卸载后手动删掉%APPDATA%\Code和%USERPROFILE%\.vscode两个目录再重新安装才能拿到一个真正干净的初始状态。注意删除 %APPDATA%\Code 等于删掉所有用户设置和快捷键绑定。动手之前先导出一份配置左下角齿轮 → 设置 → 右上角更多操作 → 导出配置文件。2.3 装完先验证 code 命令是否生效安装完成后打开 PowerShell 或命令提示符输入code --version如果正常输出版本号说明 PATH 已经生效。如果提示找不到命令大概率是安装时没勾添加到 PATH或者你用的是旧命令行窗口没刷新环境变量。解决办法重新运行安装包勾上 PATH 选项做一次修复安装或者关掉所有命令行窗口重新开一个再试因为环境变量只对新开的窗口生效。验证通过后随便进一个文件夹在地址栏输入 cmd 回车再输入code .这行命令会用 VS Code 打开当前文件夹。我平时开发基本都靠这个组合先在资源管理器里定位到项目目录然后敲一下code .比一层层找图标快得多。这也是检验安装是否成功最直接的方式。3. 中文环境配置语言包只是第一步切换才是关键3.1 安装中文语言包的正确姿势VS Code 界面汉化靠的是微软官方出的Chinese (Simplified) (简体中文) Language Pack扩展。打开 VS Code 后左侧边栏点扩展图标快捷键 CtrlShiftX在搜索框输入Chinese第一个结果通常就是简体中文语言包发布者显示为 Microsoft。认准官方标识再点 Install。这里有个新手特别容易踩的坑搜索 Chinese 会出来一堆名字带 Chinese 的扩展比如什么字体、插件之类只要发布者不是 Microsoft 就不要装。语言包只需装这一个装多了反而可能产生干扰。另外注意区分简体和繁体简体是Chinese (Simplified)繁体是Chinese (Traditional)。有人随手装了个繁体包界面虽然变中文了但全是繁体字还以为配置成功。搜索时关键词用简体或Simplified更保险。3.2 切换显示语言的完整步骤装完语言包先别急着高兴——很多人这时候发现界面还是英文就开始怀疑人生。其实语言包装好只是第一步还需要主动切换显示语言。按 CtrlShiftP 打开命令面板输入Configure Display Language中文环境下显示为配置显示语言回车。弹出的列表里会显示已安装好的语言包比如 en英文和 zh-cn简体中文。选中 zh-cnVS Code 会提示重启点确定重新打开界面就变成中文了。如果你更习惯直接改配置文件也可以手动编辑。找到%APPDATA%\Code\User\locale.json内容是这样的{ locale: zh-cn }把 locale 改成 zh-cn 保存然后完全退出 VS Code 再重新打开。注意这个文件如果不存在手动新建一个放在同目录下也行。但更推荐用命令面板切换因为 VS Code 会自动创建并校验文件不容易写错。3.3 配置完还是英文按这几步排查我处理过不少明明设置了中文却不生效的情况按出现频率排序原因大致是这几类。一是没有彻底重启。VS Code 关闭时会停留在系统托盘直接点右上角 X 并不会完全退出。切换语言后要在托盘图标上右键退出或者用任务管理器确认 Code.exe 相关进程都结束再重新打开。二是 locale.json 写错格式。常见错误是把 zh-cn 写成 zh_CN 或 cn或者整个文件格式不对导致 VS Code 回退到默认英文。建议删掉自己写的文件用命令面板重新切换一次让程序自己生成标准配置。三是语言包版本和编辑器版本不匹配。极少数情况下语言包版本落后会导致不生效去扩展页面看语言包是否需要更新更新后再切换一次。四是旧版缓存残留。以上都排除了可以退出 VS Code 后手动删除%APPDATA%\Code\CachedData目录里的内容放心删这些是缓存下次启动会自动重建再打开通常就好了。还有一种快速验证方式命令行启动时强制指定语言code --localezh-cn如果这样能正常显示中文说明语言配置本身没问题问题大概率出在缓存或重启不彻底上。4. 装完先做这四件事让编辑器按你的习惯来4.1 字体、字号和主题第一眼的舒适度在这里决定默认的 Consolas 字体其实还行但如果你觉得编码时字母和数字区分度不够建议换成 Cascadia Code 或 JetBrains Mono 这类专门为代码设计的等宽字体。系统里没装的话去字体官网下载安装然后在设置里指定。按 Ctrl, 打开设置搜索 fontFamily把默认值改成类似这样editor.fontFamily: Cascadia Code, Consolas, Courier New, monospace, editor.fontSize: 16, editor.lineHeight: 1.6第一个字段里排在前面的字体优先使用找不到就依次往后找。字号 14 到 16 对大多数显示器都舒适行高 1.6 是我个人喜欢的密度不太挤也不太散。主题方面默认的 Dark 已经很不错新手不用急着换。想换的话扩展市场搜One Dark Pro或Material Theme装完在设置里选一个顺眼的就行。记住一点换主题不影响任何代码运行纯粹是视觉偏好不用纠结。4.2 自动保存、文件编码和换行符提前配好少踩坑新手最常遇到的文件没保存就关了问题靠自动保存就能解决。设置里搜 autoSave选择 afterDelay保存延迟设 1000ms这样停止输入一秒后自动保存基本告别手动 CtrlS。还有两个偏底层的设置建议提前确认files.encoding: utf8, files.eol: \n编码用 UTF-8 是因为现在绝大多数项目和跨平台协作都默认 UTF-8避免中文乱码。换行符统一成 LF\n是为了避免在 Windows 上写出的文件放到 Linux 或 Mac 上出现兼容问题。如果你只做 Windows 本地开发第二项可以不改但凡是做 Web 前端或后端强烈建议统一为 LF。4.3 集成终端把默认 shell 换成真正好用的那个VS Code 里按 Ctrl 就能打开集成终端不需要额外开一个命令行窗口。终端默认用系统自带的 PowerShell对 Windows 用户够用但如果你装了 Git我建议把默认终端换成 Git Bash因为它在处理 bash 脚本和 Unix 命令时更自然。设置里搜terminal.integrated.defaultProfile.windows选择 Git Bash 即可。换好之后在 VS Code 里就能直接运行git status、python这些命令后面配合 Git 教程会非常方便。这一步属于装完顺手做的提升项不做也不影响基本使用。但如果你打算跟着各种安装教程Python、Node.js、Git走建议现在就配好省得后面来回切换窗口。5. 高频问题排查几种看着吓人的报错其实根因都简单5.1 code 命令找不到和 PATH 环境变量的那点事第 2 节提过一次这里再展开说。如果你在 cmd 或 PowerShell 里输入 code 提示找不到命令根源只有两个一是安装时没勾添加到 PATH二是环境变量修改后没重启终端。排查顺序很简单。先手动打开 VS Code按 CtrlShiftP 输入 shell command选择在 PATH 中安装 code 命令Install code command in PATH。这个操作相当于帮你把 code 可执行文件路径写入用户环境变量比手动改 PATH 更不容易出错。执行完关掉现有终端重新开一个再输入code --version验证。注意VS Code 装在非默认目录比如 D 盘时手动改 PATH 要确保路径指向 bin 目录下的 code.cmd。路径里有空格的话用引号包住整个路径。5.2 启动报错或界面异常ServiceHub 相关报错的排查链路有读者反馈过这样一条报错由于出现错误无法启动 Visual Studio。 Microsoft.ServiceHub.Client.ControllerConnectionException: Controller terminated before accepting connections. Exit code: -2146233082.先说清楚这条报错常见于 Visual Studio也就是那个写 C#、C 的重量级 IDE不是 VS Code。但因为经常出现在和 VS Code 混装的机器上很多人以为是自己装的 VS Code 坏了。如果你确定报错的是 VS Code按下面顺序排查。第一步打开任务管理器把所有 Code.exe 进程结束包括托盘里的。第二步删除 VS Code 的缓存目录%APPDATA%\Code\Cache和%APPDATA%\Code\CachedData这两个目录都是可再生缓存删了不影响设置和扩展。第三步清理临时目录里的 VS Code 残留在地址栏输入 %TEMP%搜索 vscode 开头的文件夹和文件并删除。第四步重新启动 VS Code。如果问题依旧打开日志目录%APPDATA%\Code\logs按时间从近到远找错误日志重点看有没有权限不足无法写入之类的关键字。有的话说明是用户目录的访问权限被限制把 Code 目录的所有者改回当前用户再试。最后兜底方案是备份设置后彻底重装先记录扩展列表命令行执行code --list-extensions卸载软件删除%APPDATA%\Code和%USERPROFILE%\.vscode重新安装后按扩展列表手动装回。补充一句如果这条报错确实来自 Visual Studio 本体而不是 VS Code直接打开Visual Studio Installer点击修复并更新 .NET 运行时基本能解决。5.3 unable to find suitable Visual Studio toolchain名字像但跟 VS Code 没直接关系另外一个极易混淆的报错Unable to find suitable Visual Studio toolchain这个报错大多出现在 Flutter 开发 Windows 桌面应用时。Flutter 要求系统里装 Visual Studio再看一眼不是 Visual Studio Code是 Visual Studio并且勾选使用 C 的桌面开发工作负载。很多人装了 VS Code 就以为满足条件了结果 Flutter 一直报这个错卡了半天。解决办法是去 Visual Studio 官网下载社区版Community安装时在工作负载步骤勾选使用 C 的桌面开发。装完回到 Flutter 项目重新执行flutter doctor就能看到Visual Studio - develop Windows apps这一项变成绿色通过。这里多说一句Visual Studio Code 和 Visual Studio 是两个独立产品前者是轻量代码编辑器后者是重量级集成开发环境。很多配置 C/C 环境的教程用 VS Code 搭配 MinGW这没问题但如果你需要编译 Windows 原生桌面应用或者跑 Flutter Windows 端就需要真正的 Visual Studio。搞不清这两者的区别是新手最常见的困惑来源之一。5.4 扩展装不上、语言包搜不到从网络和离线安装两个方向解决VS Code 安装扩展需要访问扩展市场。如果搜索框里搜不到任何结果或者点安装后一直转圈先别怀疑软件坏了按下面顺序检查。第一确认系统时间正确。电脑时间不对会导致证书验证失败很多网络请求都会异常这是最不起眼但也最容易忽略的原因。第二检查防火墙或安全软件是否拦截了 VS Code 的网络请求把 code.exe 加入白名单再试。第三如果网络确实受限可以用离线安装方式在有网络的机器上打开扩展市场网页搜索需要的扩展下载 VSIX 安装包拷到目标机器上在 VS Code 扩展页面的更多操作里选择从 VSIX 安装选中文件即可。这个方法同样适用于中文语言包。当扩展市场里实在搜不到语言包时用离线 VSIX 方式安装是最直接的出路。装完再按第 3 节的步骤切换显示语言效果完全一致。6. 安装验收用两个小例子确认能干活了6.1 第一个 HTML 文件验证中文、编码和自动保存这一步推荐所有新手都做一遍不是为了学 HTML而是为了验证刚才所有配置是否真的生效。新建一个文件夹比如 D:\demo在 VS Code 里通过文件 → 打开文件夹打开它或者直接命令行code D:\demo。在左侧资源管理器新建文件 test.html输入以下内容!DOCTYPE html html langzh-CN head meta charsetUTF-8 title中文测试/title /head body h1你好Visual Studio Code/h1 /body /html保存后在系统的文件资源管理器里找到 test.html 双击打开浏览器会自动渲染这个页面并正常显示中文说明 UTF-8 编码设置正常。如果装了 Live Server 扩展也可以在编辑器里右键选择 Open with Live Server体验实时刷新。修改内容后等一秒看标签页上的圆点是否消失验证自动保存是否生效。再到命令面板里确认当前显示语言是 zh-cn界面菜单是中文整个安装和中文配置链路就算完整跑通了。6.2 C/C 还需要编译器编辑器不等于开发环境很多人装了 VS Code 后第一件事是搜C/C 配置教程结果发现要来回来去装 MinGW-w64一下就懵了。用一句话解释VS Code 只是个编辑器它不懂编译C/C 源码要变成可执行文件必须有一个编译器。在 Windows 上最常用的组合是 VS Code C/C 扩展 MinGW-w64 编译器。配置思路是先下载 MinGW-w64 安装包解压或安装到某个目录例如 D:\mingw64把它的 bin 目录路径加进系统 PATH然后在命令行执行gcc --version验证。接着在 VS Code 里安装官方的 C/C 扩展新建 hello.c 写一小段代码按 F5 调试运行VS Code 会引导你配置 tasks.json 和 launch.json。这两份配置文件的详细写法内容较多值得单独写一篇这里先记住大方向编辑器装好只是第一步编译工具链才是能不能跑起来的关键。6.3 和 Python、Git、Node.js 教程怎么衔接从各种热搜来看很多人是在装完 Python、Git、Node.js 之后才轮到 VS Code或者反过来装完 VS Code 打算接着装这些。衔接方式其实很简单装好这些工具后在 VS Code 的集成终端里分别执行python --version git --version node -v三条命令都能输出版本号就说明工具链和 VS Code 的终端已经打通。接着去扩展市场装对应的扩展Python 装官方 Python 扩展Git 装 GitLens 或 Git HistoryNode.js 装 ESLint 和 Prettier。这些扩展装好后VS Code 会提供语法提示、代码补全和调试入口但底层的运行环境仍然来自你安装的 Python、Node.js 本身。理解了这个分工后面看任何XX 环境配置教程都不会绕晕。我个人在实际安装过程中的体会是——VS Code 的安装和中文配置难的根本不是点下一步这个动作而是理解编辑器、语言包、编译器和语言运行时各管一摊的分工逻辑。把这条主线理清楚哪怕换一台电脑重装也能在十分钟内搭出一套同样的环境。上面提到的报错如果以后真遇上了按排查顺序走一遍绝大多数都能自己解决。
返回列表