VS Code:一间可扩展的工作室
装好、配顺、认得工作区——给自己搭第一间数字工作室。
学习证据 学完后,怎么核对?
把学习结果留在一个可以回看、可以复做的动作里;这一区只写学生能自己检查的证据。
如何核对
- 工作区范围与扩展来源记录
- 安装权限、同步与遥测设置核对
适用边界
本地编辑无需账号;只在有安装权限的设备上打开自己有权访问的文件夹。扩展、账号登录、设置同步与遥测按学校政策和当前官方说明核对,共用设备不保留账号。
最后复核
这是内容复核日期,不是学习截止日期。
讲
例子记事本写页面的第三天,小雨破防了
初中时用文本编辑器、浏览器和项目 HTTP 预览就能做出第一个网页,工具很少,流程也短。可项目一长大就露怯了:小雨想把页面里十几处旧颜色全换掉,记事本连「全部替换预览」都没有;标签少敲一个斜杠,没有任何提醒,页面白屏找错找了半小时。木匠不会一辈子蹲在地板上干活——活儿多了,就该有间工作室。
名词这间工作室叫 VS Code(Visual Studio Code)——一款免费开源的代码编辑器,也是当下用得最广的一款。两个配套词:工作区=你「打开的那个项目文件夹」,一次打开一棵树而不是一个文件;扩展=按需加装的插件,让同一间工作室能干不同的活。
定义一间工作室的三块地皮
别被密密麻麻的按钮吓住,VS Code 的布局就三块:侧栏是货架(资源管理器摆着你的项目树),编辑区是工作台(可以分屏对照着改),集成终端是传声筒(上一课的 pwd / ls / cd 在这里照用,而且天生就站在项目文件夹里)。
三块地皮认全,这间工作室就算入住了:货架(侧栏)、工作台(编辑区)、传声筒(终端)。
入住之后,先记五把顺手的钥匙(macOS 把 Ctrl 换成 Cmd):
| 钥匙 | 开哪扇门 |
|---|---|
Ctrl+P | 按文件名秒开文件——项目再大也不用鼠标翻树 |
Ctrl+F | 当前文件里找(和替换) |
Ctrl+Shift+F | 整个项目里找——跨文件搜文字,命中处全列出来 |
Ctrl+/ | 把选中行变成注释/取消注释 |
Ctrl+` | 呼出集成终端 |
泛化换个角度:这是学一切专业工具的三步法
今天的路线其实是个通用套路——先认布局(三块地皮各管什么),再记五键(最高频的操作练到不过脑),扩展等真问题来了再装(需要驱动,不是囤积)。以后你学 Photoshop、剪映、Blender,或任何一款专业软件,都是这三步。专业工具的可怕来自功能大全;专业用户的从容来自「我只精通我需要的那一小圈,并且知道怎么扩」。
例
补充三例——两个常见用法,一个易错。
小雨用「文件 → 打开文件夹」打开上一课的 studio——注意是打开文件夹,不是打开单个文件。左边货架立刻长出项目树;她点开 index.html,右键「在侧边打开」分出第二屏,一边看结构一边改文字;Ctrl+` 呼出终端,pwd 一敲,果然已经站在 studio 里。改完保存,在项目 HTTP 预览中刷新,浏览器里立刻是新样子——编辑器、终端、项目树,从此在同一扇窗里。
阿哲的项目做到第七个页面,想把口头禅「超级好用」全改成「顺手」。他按 Ctrl+Shift+F 搜「超级好用」——三个文件里 11 处命中全部列在左栏,每处带上下文预览。他逐条扫一眼(第 8 处在引用别人的话里,不能改),其余点替换。比逐个文件开开关关快十倍,还不漏、不误伤。
阿豪听说「VS Code 全靠扩展」,一晚上装了 30 多个:五套图标主题、四个「效率神器」、还有俩功能重复的格式化工具。结果启动变慢、右下角通知弹个不停,两个格式化工具还打架——保存一次代码被改成两种风格。错在哪:把「可扩展」理解成了「多多益善」,扩展没有需求牵引,装了也不会用,还互相干扰。修法:卸到零,改成「遇到一个真问题,才装一个对症的」,装前看一眼下载量和评分;月底清一次这个月没用过的。
做
你想知道「深色模式」这几个字出现在项目的哪些文件里——按哪把钥匙?
- 先确认学校设备允许安装;允许时只从 VS Code 官网(code.visualstudio.com)下载。安装步骤看懂再点,遇到管理员提示就停,不要自行绕过;共用设备不要登录设置同步,并核对遥测设置是否符合学校政策。
- 「文件 → 打开文件夹」只打开上一课的
studio,确认左侧货架长出了你的项目树。 - 打开 index.html 写上一句话保存,用项目 HTTP 预览打开并在浏览器里看到它。
Ctrl+`开终端,pwd确认自己站在 studio;再把五把钥匙各真按一次。
怎么算过关:工作区左侧能看到 studio 三项;改动保存后浏览器能看到;五个快捷键各用过一次,说得出各开哪扇门。
卡
VS Code 的三块布局是什么?学专业工具的三步法呢?
侧栏=货架(项目树)、编辑区=工作台(可分屏)、集成终端=传声筒(Ctrl+`)。三步法:先认布局,再记五个高频快捷键,扩展等真问题来了再按需装。
- 打开的是文件夹不是文件:工作区一次装下整棵项目树。
- 五把钥匙练到不过脑:P 开文件、F 页内找、Shift+F 全项目找、/ 注释、` 终端。
- 扩展按需装、定期清——工具服务于问题,不是收藏品。