简介：面向零基础开发者和刚接触编程环境配置的学习者，这份PDF围绕 Visual Studio Code 的入门使用展开，内容涉及编辑器定位与适用场景、官方获取渠道、安装流程中的路径选择与选项说明、中文语言包与常用语言插件的配置，以及设置优化、项目文件夹导入和 HTML 文件创建等基础知识。讲解以 Windows 版本为主线，同时提示其他版本的选择思路，便于读者建立对轻量级代码编辑器的整体认识。资源包共1个PDF文件，大小约2.12MB，篇幅紧凑，适合作为环境搭建与基础操作的随身查阅材料。已有1496人学习，说明其在入门配置场景中具有一定参考价值。读者可据此了解 VSCode 的基本界面、插件扩展方式和简单项目组织方法，为后续编写网页或进行代码练习打下基础。
1. 一份 PDF 教程能帮你省掉的第一个下午
「装个编辑器能有多难」——大多数人点开第一份 VSCode 下载与安装教程时都是这个心态，然后在「装完是英文」「右键菜单里找不到」「命令行敲 code 提示不是内部命令」这些地方耗掉一下午。这份 PDF 把流程拆成六段：软件介绍、官方下载地址、安装向导、首次使用、基础知识、新建项目，顺序是对的——先认清楚这东西是什么，再下载，再装中文包，最后才谈「项目」这件事。它适合三类人：第一次碰代码编辑器的学生、习惯用记事本改配置的运维、以及要给团队交付一套「照着点就行」环境文档的负责人。内容不深，但每一步都有对应截图，属于那种可以边看边点、点完就能跑起第一个 HTML 文件的材料。
2. 装之前先搞清定位：编辑器、IDE 与下载页上的三个分支
动手之前先把两件事想明白，能省掉后面一半的返工：一是这软件到底该承担多少活，二是下载页面上那一排按钮分别对应什么。很多人装完觉得「不好用」，问题不在软件，在于一开始就选错了形态。
2.1 轻量编辑器 + 扩展，而不是全家桶式 IDE
VSCode 的定位是一个跨平台免费源代码编辑器，内置语法高亮、代码自动补全、代码重构、查看定义，还带了命令行工具和 Git 版本控制。注意这里的措辞：编辑器，不是 IDE。它的主体非常轻，真正的语言能力来自扩展——语言服务器协议负责补全和跳转，调试适配协议负责断点调试，扩展只是把这些能力挂上去的插头。这就是为什么你刚装完打开一个 .py 文件，它只会给你高亮，不会给你补全，得先装对应语言的扩展。
理解这个模型之后，选型就简单了。写前端、写脚本、改配置文件、看别人的仓库、连远程机器改代码，这类「文件级」的活交给它最舒服，启动一两秒，内存占用可控。反过来，如果你要做的是大型 Java 工程、需要重度重构、需要可视化界面设计器、需要一整套开箱即用的调试配置，那重型 IDE 的预置能力更省心，硬拿编辑器去拼装反而是在给自己找活干。我的判断标准很土：如果一个项目你打开后要装五个以上扩展才能正常写代码，那说明这个技术栈的「全家桶」形态更合适；如果只是偶尔改几个文件，别为它装一整套重装备。
还有一个常被忽略的点：VSCode 的「重」是可以自己控制的。同一个安装包，装三个扩展和装三十个扩展，冷启动时间和内存占用能差出一倍以上。所以真正该问的不是「它和 IDE 谁强」，而是「我这个技术栈需要哪几个扩展」。这个问题想清楚了，第 4 章装插件的时候就不会瞎点。
另外提醒一句：教程里写的「访问所有内容只需要一个快捷方式」，说的是安装完成后从开始菜单或桌面图标进入即可，不需要为每种语言单独开一个程序。这是编辑器形态带来的好处，也意味着你的所有工作都收敛到一个窗口里，窗口管理习惯要跟着改——用「打开文件夹」区分项目，而不是开多个实例。
2.2 下载页上那排按钮，到底该点哪个
官方下载页默认给你的是 Windows 用户安装程序，点主按钮拿到的基本就是它。页面下方还有一个「其他平台/其他版本」的入口，点进去会看到按操作系统和架构分类的清单。这里有三组选择，选错了后面全是坑。
第一组是安装形态。用户安装程序装在当前用户目录下，不需要管理员权限，升级也顺；系统级安装程序装到全局目录，多用户共用一台机器时才需要它，代价是每次装和升级都要提权；压缩包形态是免安装的，解压即用，适合放在移动硬盘里带着走，或者在受限环境里跑。教程默认走的是用户安装，这是对新手最友好的路径，我一般也推荐这个。
第二组是架构。现在主流机器是 x64，苹果 Silicon 和部分 ARM 笔记本要走 ARM64 版本。装错架构通常不会立刻报错，而是表现为启动慢、扩展加载异常这类玄学问题，排查起来很浪费时间。不确定的时候去系统信息里看一眼处理器架构，比事后猜要快得多。
第三组是发布通道。稳定版是默认选择；预览版通道更新更频繁，新功能先上，但也更容易遇到扩展不兼容。除了你想提前试某个特性，否则一律用稳定版。教程里只讲了稳定版的下载，这个取舍是对的——新手阶段没必要碰预览通道。
2.3 安装向导每个勾选项，对应装完之后的一个具体行为
安装向导一共五六个界面，前面几个（同意协议、选路径、开始菜单文件夹名）没什么好说的，真正影响日常使用的是「附加任务」那一屏。那一屏的勾选项不是装饰，每一个都对应装完之后你能不能用某个功能，我在第 3 章会逐项拆。这里先给个结论：至少要把「添加到 PATH」和「文件/目录右键菜单」这两类勾上，否则你会在命令行里敲 code 提示找不到命令，也会在资源管理器里右键找不到入口，然后回来重装一遍。
安装路径也有讲究。默认路径在当前用户的本地程序目录下，路径里有空格，这在绝大多数场景下没问题，但如果你后面要接一些老旧的构建工具或者自己写脚本调用编辑器可执行文件，路径里的空格会让你多写不少引号。我的习惯是装到一个短路径下，比如 D 盘根目录建一个 Tools 目录，省掉后续脚本里一堆转义。这不是必须的，但属于装一次省三年的小决策。
3. 从安装包到中文界面：六步装完，三条命令验收
这一章是全文最「可抄」的部分。按顺序走完，你能得到一个能正常显示中文、能在命令行里用 code 打开目录、能跑起第一个 HTML 文件的编辑器。
3.1 安装向导逐屏操作与勾选项的实际含义
第一步，双击安装包，点「我同意此协议」，下一步。第二步，选安装路径，点「浏览」可以改，不改就走默认，下一步。第三步，开始菜单文件夹名，保持默认即可，这个名称只影响开始菜单里的显示，不影响任何功能。第四步是重点，附加任务那一屏：
- 创建桌面快捷方式：纯粹看个人习惯，我一般不勾，任务栏固定一个就够了。
- 将「通过 Code 打开」操作添加到 Windows 资源管理器文件上下文菜单：勾上。这是单文件编辑最常用的入口，右键一个 .json 或 .log 直接进去改。
- 将「通过 Code 打开」操作添加到 Windows 资源管理器目录上下文菜单：勾上。这个比上一个还常用，右键一个文件夹直接把它当项目打开。
- 将 Code 注册为受支持的文件类型的编辑器：谨慎勾。勾了之后 .txt、.log 这类文件的默认打开方式会变成编辑器，好处是双击就进；坏处是你在别处双击一个文本文件也会跳进编辑器，有些人会觉得被打断。
- 添加到 PATH：必须勾。这是 code 命令能用的前提。
- 使用其他终端（部分版本有）：按需，不影响主流程。
第五步确认信息，点安装，等进度条走完。整个安装过程通常不到一分钟，如果卡在最后一步很久，多半是杀毒软件在扫描新写入的文件，等一会儿或者把安装目录加进白名单即可。
批量部署或者重装的时候，手动点太慢，常见做法是用安装器自带的静默参数。下面这段是 PowerShell 写法：
# 静默安装：不弹任何界面，装完不自动启动，勾选右键菜单与 PATH Start-Process -FilePath ".\VSCodeUserSetup.exe" -ArgumentList ` "/VERYSILENT", ` "/MERGETASKS=!runcode,addcontextmenufiles,addcontextmenufolders,associatewithfiles,addtopath" ` -Wait逻辑说明：/VERYSILENT表示全程无界面，失败也不弹窗；/MERGETASKS用来增删附加任务，前面的感叹号表示「取消这个默认勾选项」；runcode对应「安装完成后启动」，取消它是为了脚本能串行执行后续步骤；addtopath、addcontextmenufiles、addcontextmenufolders、associatewithfiles分别对应上表里的 PATH、文件右键、目录右键、文件类型关联。参数名以安装器实际接受为准，不同打包方式可能有细微差别，跑之前建议先在测试机上验一遍。
3.2 中文语言包：装完不重启等于没装
第一次启动是英文界面，这属于正常现象——语言包是扩展，不是安装包自带的。操作路径有两条，结果一样。
图形路径：左侧活动栏点扩展图标（四个方块那个），在搜索框输入Chinese，找到简体中文语言包，点安装。装完右下角会弹一个提示，问你要不要现在切换语言并重启，点「Change Language and Restart」。如果当时手快点了关闭，也没关系，下次启动还是英文，手动切：按Ctrl+Shift+P打开命令面板，输入Configure Display Language，选「中文(简体)」，重启。
如果命令面板里根本找不到中文选项，说明语言包没装上，回到扩展面板再搜一次。还有一种情况是扩展装了但没生效，检查设置里有没有"locale": "zh-cn"这一项，没有就手动加上。
{ // 界面语言，装完中文语言包后才会生效 "locale": "zh-cn" }这段配置写在用户设置里，全局生效。参数说明：locale的可选值由已安装的语言包决定，写成zh-cn对应简体中文，写错或者对应的包没装，界面会回落到英文，不会报错——这也是为什么很多人以为自己「装了个假的语言包」。
重启之后再看，菜单、设置、右键全部变成中文。到这一步，安装阶段基本结束了。
3.3 三条命令验收：版本、扩展、当前目录
打开一个终端（PowerShell 或 CMD 都行），依次跑下面三条。
# 1. 确认 code 命令能被系统找到，并输出编辑器版本与架构 code --version # 2. 列出当前已安装的全部扩展，确认中文包在里面 code --list-extensions # 3. 把当前目录作为项目在编辑器里打开 code .第一条命令输出三行：版本号、提交哈希、架构标识。能出结果就说明 PATH 配置成功，装的时候那个勾没白勾。如果提示「不是内部或外部命令」，别急着重装，先看第 5 章第一条排查路径。
第二条命令输出的是扩展 ID 列表，中文语言包的 ID 形如ms-ceintl.vscode-language-pack-zh-hans，能在这份列表里看到它，说明语言包装上了，界面没变中文就只是 locale 没切。
第三条命令是日常使用频率最高的一个。code .里的点代表当前目录，编辑器会把这个目录当成工作区打开。同理code ../another-project可以打开上级目录下的另一个项目，code somefile.js会直接打开单个文件。这条命令的价值在于：你可以在终端里cd到任意位置，然后一句话把编辑器拉起来，不用回到图形界面里一层层点「打开文件夹」。
提示：三条命令建议按顺序跑，第一条失败就不用往下试了，PATH 没通的情况下后面两条必然失败，先解决问题再验收。
4. 目录即项目：没有「新建项目」按钮时的工作流
教程里专门点了一句「由于 VSCode 没有新建项目，所以只能手动新建文件夹导进去」。这句话是很多新手的第一道坎——习惯了 IDE 里「File → New Project → 选模板」的人，面对一个空白窗口会不知道该干嘛。答案其实很简单：项目就是文件夹，文件夹就是项目。
4.1 手动建目录，再「打开文件夹」
标准动作是三步：建目录、建文件、打开。命令行里一行搞定。
# 建项目目录并进入 mkdir demo-site && cd demo-site # 建一个入口文件和两个子目录（css、js 按需） mkdir css js touch index.html css/style.css js/main.js # 用编辑器打开这个目录，它就成了一个「项目」 code .逻辑说明：mkdir demo-site创建项目根目录，&&保证前一条成功才执行后一条；code .是第 3 章验证过的那条命令，把当前目录作为工作区载入。参数说明：目录名避免使用空格和特殊字符，虽然编辑器本身能处理，但一旦涉及构建脚本、路径拼接、某些命令行工具，带空格的路径会给你添不少麻烦。touch在 Windows 的 PowerShell 里不是内置命令，等价的写法是ni index.html或者直接在编辑器里右键新建文件，效果一样。
打开之后左侧资源管理器会显示整个目录树，这时候你新建的文件会自动落在当前打开的文件夹里，而不是散落在某个默认位置。这一点很关键：如果你是用「文件 → 打开文件」单独打开一个文件，新建的文件可能出现在别处，过两天就找不到了。养成「先打开文件夹、再在里面建文件」的习惯，能省掉大量「我文件存哪了」的困惑。
第一个 HTML 文件可以这么写，用来验证编辑器的高亮、补全和预览链路是否都通：
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>第一个页面</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <h1>编辑器装好了</h1> <script src="js/main.js"></script> </body> </html>说明：charset声明成 UTF-8，是为了避免中文在浏览器里变成乱码——这类问题排查起来很像玄学，其实九成是编码没声明；link和script用了相对路径，正好验证目录结构是否建对。保存后在资源管理器里双击这个文件，浏览器能正常显示标题就说明整条链路通了。
4.2 settings.json 里那几个真正值得改的参数
设置界面是图形化的，但真正好用的是 JSON 配置文件。按Ctrl+Shift+P，输入Open User Settings (JSON)，打开的就是用户级配置。下面这几项是我每台机器都会改的。
{ // 字号与行高，13~15 是比较常见的选择，长期看代码别设太小 "editor.fontSize": 14, "editor.lineHeight": 1.6, // 缩进：前端项目通常是 2，Java/Python 习惯 4，按团队规范定 "editor.tabSize": 2, "editor.insertSpaces": true, // 保存时自动格式化，前提是对应语言的格式化扩展已安装 "editor.formatOnSave": true, // 失焦自动保存，改配置文件时很好用，写正式代码建议改成 afterDelay "files.autoSave": "onFocusChange", // 资源管理器里隐藏编译产物，别让 node_modules 撑爆目录树 "files.exclude": { "**/.git": true, "**/node_modules": true, "**/dist": true }, // 终端默认 profile，Windows 上一般显式指定，避免串到旧版控制台 "terminal.integrated.defaultProfile.windows": "PowerShell" }逐项说明：editor.tabSize配合insertSpaces一起用，只改前者不改后者，按 Tab 出来的还是制表符，团队里混用会导致 diff 一片红；files.autoSave有三个取值——off关闭、afterDelay停止输入一段时间后保存、onFocusChange切走窗口就保存，改配置文件时用后者很顺手，但写业务代码时容易在没想好的时候就落盘，建议按场景切；files.exclude只影响资源管理器的显示，不删文件，但被隐藏的目录仍然参与搜索，如果搜索也被拖慢，再配search.exclude。最后那个终端 profile，Windows 上如果不指定，某些情况下会拉起旧版控制台，中文显示会出问题。
这份配置可以直接抄，但建议一次只改两三行，改完观察一两天。一次性贴进去三十行，出了问题你不知道是哪一行导致的——这是我自己踩过的坑。
4.3 扩展按语言装，别一口气装一屏
扩展面板里按「安装量」排序，前排永远是那几个通用插件，新手很容易一屏装下去，结果启动变慢、补全打架。合理的做法是按当前技术栈装，一门语言配两三个。
前端方向：HTML、CSS、JavaScript 的语言支持在现代版本里已经内置了基础能力，你需要补的是格式化工具和本地静态预览服务器。装一个能起本地服务的扩展，右键 HTML 文件选「Open with Live Server」类的入口，改完保存浏览器自动刷新，这个体验提升很明显。
Python 方向：装官方 Python 扩展，它会把解释器选择、调试、Jupyter 交互一起带进来；再配一个格式化工具（比如基于 black 的），保存即格式化。这里要注意的是解释器路径，第 5 章会讲这个问题导致的「包明明装了却提示找不到模块」。
其他语言类似思路：语言官方维护的那个扩展优先，第三方花哨插件往后排。装完一轮之后，回头看一眼 CPU 占用，如果空载状态下编辑器常驻占用明显偏高，多半是装了某个一直在后台扫描的扩展，用code --disable-extensions启动对比一下就能定位。
5. 避坑与排查：安装和首次使用最常翻车的五个现场
下面这五条，前两条发生在安装阶段，后三条发生在第一次使用的头两天。每条按现象、原因、解决的顺序写，遇到问题时对号入座即可。
5.1 安装阶段的两个坑
坑一：命令行里敲 code，提示不是内部或外部命令。
现象是终端里执行code --version直接报错，但编辑器本身能正常打开。原因基本只有一个：安装时「添加到 PATH」那一项没勾，或者勾了但当前终端是在安装之前打开的，环境变量还是旧的。解决方式分两步，先关掉所有终端窗口重开一个再试，环境变量在进程启动时读取，老窗口不会自动刷新；还是不行就重新运行安装包，选「修改/修复」把 PATH 那一项补上。急用的话也可以手动加，PATH 里追加安装目录下的bin子目录即可，路径形如%LOCALAPPDATA%\Programs\<安装目录>\bin，加完同样要重开终端。
坑二：右键菜单里没有「通过 Code 打开」。
现象是在资源管理器里右键文件或文件夹，找不到编辑器入口。原因是安装时「添加到资源管理器上下文菜单」这两项没勾。解决方式是重新运行安装程序，进到附加任务那一屏，把文件和目录两个右键项都勾上，安装程序会更新注册表项。注意这一步在部分企业管控的机器上会被策略拦掉，如果重装后仍然没有，就是策略问题，不折腾了，改用code .命令打开，效果一样。
5.2 首次使用阶段的三个坑
坑三：语言包装了，界面还是英文。
现象是扩展列表里明明有中文语言包，重启后菜单仍是英文。原因有两个层面：一是装完语言包后没走「Change Language and Restart」那个流程，只是关掉了弹窗；二是设置里有locale项但值写错，或者被工作区级设置覆盖了。解决方式是按Ctrl+Shift+P执行Configure Display Language手动选一次，选完必须完整退出再启动，光关闭窗口有时不算退出；仍不生效就去用户设置里确认"locale": "zh-cn"，同时检查工作区设置里有没有同名字段把它盖掉。
坑四：打开文件夹后，资源管理器里空空如也。
现象是明明目录里有文件，左侧却只显示一两个。原因是files.exclude配得太狠，把整个目录模式都排掉了，或者你打开的是上一层目录，真正的内容在子目录里没展开。解决方式是先看设置里的files.exclude，临时注释掉可疑项；再确认标题栏显示的是不是你以为的那个目录。这个坑的迷惑之处在于它不报错，只是「看起来没文件」，容易误判成文件丢了。顺带提一句，被files.exclude隐藏的文件仍然参与全局搜索，所以偶尔会出现「搜得到但看不到」的情况，那是另一个排查方向。
坑五：Python 包明明装了，编辑器却提示模块找不到。
现象是终端里pip list能看到某个包，编辑器里 import 却报红线。原因是编辑器用的解释器和你在终端里用的不是同一个——机器上往往同时存在系统 Python、某个发行版自带的 Python、虚拟环境里的 Python。解决方式是按Ctrl+Shift+P执行Python: Select Interpreter，从列表里选中项目虚拟环境对应的那个解释器，选中后窗口右下角会显示当前解释器路径，确认一下再重开文件。养成「每个项目先选解释器」的习惯，能避掉一大类莫名其妙的报错。
注意：以上五条的排查顺序都是先看配置、再看进程、最后才考虑重装。重装能解决的问题其实很少，多数情况是某个勾选项或某条配置没生效，重装一遍只是把同样的错误又走了一遍。
6. 把配置变成可复制的东西：一次备份，换机十分钟
装完一台机器不算完，真正的效率来自「换一台机器能在十分钟内恢复成一样的」。我现在的做法是三个文件解决：用户设置 JSON、扩展清单、以及一份记录了解释器路径的备忘。
扩展清单用命令行导出，比在扩展面板里一个个点快得多：
# 导出当前机器上所有扩展 ID 到文件 code --list-extensions > extensions.txt # 在新机器上批量安装（前提是 extensions.txt 和当前目录在一起） while read -r ext; do code --install-extension "$ext"; done < extensions.txt第一行把扩展 ID 逐行写到文本文件，一行一个，可以直接进版本库；第二行循环读取并逐个安装，read -r里的-r是防止反斜杠被转义，扩展 ID 里一般不会有反斜杠，但加上更保险。参数说明：--install-extension后面跟的就是扩展 ID，装过的会提示已安装，不会重复下载。这套流程在 Windows 上要用 PowerShell 的话，循环写法是Get-Content extensions.txt | ForEach-Object { code --install-extension $_ }，效果一致。
第二件事是把配置和扩展目录从系统默认位置挪出来，做成便携形态。这在多台机器共用、或者需要频繁重置环境时特别有用：
# 指定独立的用户数据目录和扩展目录，两者都不影响系统默认配置 code --user-data-dir "D:\vscode-portable\data" --extensions-dir "D:\vscode-portable\ext"--user-data-dir决定设置、快捷键、历史记录存在哪，--extensions-dir决定扩展装在哪。两个参数配合使用，等于给编辑器套了一个独立的沙盒：备份这个目录就是备份整个环境，删掉它系统默认配置毫发无损。我一般会在桌面放一个带这两个参数的快捷方式，日常就用它启动，出问题直接删目录重来，比修复安装快得多。
第三件事是定期验证，别等换机器那天才发现备份是坏的。我的习惯是每季度做一次「冷启动演练」：在一个干净的用户目录下用上面的参数起一个实例，导入 extensions.txt，打开一个真实项目，确认补全、跳转、格式化、调试四条链路都通。有一次我在演练时才发现，某个格式化扩展依赖的另一半工具是单独装的、从来没进过清单，结果换机之后保存自动格式化静默失效，不报错、不提示，只是代码风格悄悄变了。从那以后我每次整理环境都强制走一遍这个演练，宁可 quarterly 花二十分钟，也不想在交付前一天晚上翻车。希望这份笔记能帮到你，少走几个我已经替你走过的弯。
本文还有配套的精品资源，点击获取
