Visual Studio Code(简称 VS Code)是微软推出的一款免费开源跨平台代码编辑器,在前端开发领域被很多人当作主力工具。它内置了对 JavaScript、TypeScript 和 Node.js 的支持,还能通过扩展生态覆盖 C++、C#、Java、Python、PHP、Go 等语言以及 .NET、Unity 等运行时。调试方面,它可以设置断点、单步执行前端 JavaScript 代码,也支持多目标调试前后端代码。通过 SSH 连接远程服务器时,VS Code 更像一个终端模拟工具,省去上传下载步骤,在 Windows 上保存后能立即同步到远程开发机,实时性表现不错。这次提供的是绿色免安装版本,双击程序就能直接使用。

1、先把压缩包从本站下载下来并解压,会看到VS Code绿色版的文件,找到里面的“Code.exe”双击就能启动程序。

2、启动后界面默认是英文,按下 Ctrl+Shift+P 调出设置菜单,在下拉列表里点击 Configure Display Language 就能切换。

3、接着点选“Install additional languages...”这一项,就能继续添加其他语言。

4、在窗口里找到“Chinese (Simplified) Language 中文(简体)”这一项,然后点它下方那个绿色的“Install”按钮,就能把选中的语言装上。

5、装好后屏幕右下角会出现一个提示窗,按下其中的按钮,程序就会自行重启,等它再次打开时界面就已经是简体中文了。
1、为HTML和XML代码自动补全结束标签,帮你减少手动输入、避免标签配对出错,写网页时更省心。

2、Auto Rename Tag 能在你修改 HTML 或 XML 标签的一侧时,自动同步更新另一侧的标签名,省去手动逐处调整的麻烦。

3、Beautify 是一款用于整理 HTML、JS 和 CSS 代码的格式化工具,能把杂乱缩进和换行调整得清晰易读。
4、Bracket Pair Colorizer 能为代码中成对的括号分配不同颜色,让你一眼看清各个代码块的层级关系,不再被嵌套结构绕晕。
5、这款工具能把 Visual Studio Code 里设置的断点直接映射到 Chrome 浏览器,让前端调试更顺手。
6、ESLint(js语法纠错,可以自定义配置)
ESLint 是一款检查 JavaScript 代码语法的工具,支持自定义规则。这条推荐是小编的个人感受:因为每个人写代码的习惯不同,用不用完全看自己。
7、GitLens 能让你在代码编辑器里直接查看 Git 日志,方便追踪每次改动。
8、HTML CSS Support 插件能在你编辑 HTML 时自动提示页面里已经定义好的 CSS 类名和 id,省去手动翻查样式表的麻烦。
9、写HTML时不用死记标签拼写,输入开头就能自动补全,还能顺手看到每个标签是干什么用的。
10、这是一款专为 JavaScript 开发者准备的代码片段工具,支持 ES6 语法智能提示,还能帮你快速敲入常用代码。
11、为jQuery编写代码时,这个工具能根据你输入的内容实时给出补全建议,让敲代码的过程更顺手。
12、Material Icon Theme 是一款为 VS Code 设计的图标主题扩展,安装后会让编辑器里的各类文件带上对应图形标识,方便一眼区分文件类型,整体观感也更整齐好看。
13、这款插件为 React、Redux 和 react-router 的语法提供智能提示,帮助开发者更快编写相关代码。
14、Vetur 是一款为 Vue 项目提供多功能集成支持的插件,能够给出错误提示等辅助功能。
15、Class autocomplete for HTML(智能提示HTML class =“”属性)
这款插件能为 HTML 标签的 class 属性提供自动补全提示,方便编写代码。其余插件各位按自己的需要挑选就行,希望能帮上忙。
刚上手使用vs code时,建议要先把它当做一个文件编辑器(可以打字然后保存),等到有了一定经验再去熟悉那些快捷键:

1、根据您的当前上下文访问所有可用命令。

在任意界面按下 Ctrl + Shift + P 组合键,就能调出当前环境支持的全部指令列表。

2、默认键盘快捷键

如果你记不清某个操作的快捷键,可以直接打开命令面板查找,里面列出了全部命令,能配上快捷键的也会一并显示。

3、快速开启

输入命令时,比如打上 edt 或 term 再按空格,下方就会弹出可选列表;想知道有哪些命令可用,敲个问号就能看到提示。

4、改变你的主题
按下 Ctrl+K 再按 Ctrl+T 就能切换主题,想获得更多样式可以去 VS Code 扩展市场里找。
5、按键图
想给键盘配一套顺手的快捷键,用 Ctrl+K 再按 Ctrl+S 就能打开设置,搜索现有方案,也能把自定义的写进 keybindings.json,敲代码时更合自己的习惯。
1、一个编辑器,从代码到云
把精力留给写代码,少折腾工具切换。编辑器内就能完成开发、调试和部署,并可直接与 Azure、GitHub 打通。自带本地模拟器和扩展,云应用在编辑器里就能生成、运行和调试;本地或远程数据库(如 Azure Cosmos DB、MongoDB)也能导入和管理数据;配合 Azure Pipelines 有引导流程,帮你建好持续集成。静态网站、无服务器 Azure Functions、Kubernetes 集群,以及各类语言和应用类型,基本都能应付。
2、在部署之前在本地开发云应用
在本地就能搭建、启动并调试云端项目,方便快速做出原型;提前验证新功能在云环境里能否正常运行,也能减少不必要的开销。该扩展内置了 Azure 存储、Azure Cosmos DB 和 Azure Functions 的模拟器。
3、设置到云的自动部署
装上这个部署到 Azure 的扩展后,你可以 GitHub Actions 或 Azure Pipelines 打通从代码到云端的持续集成与持续交付流程;扩展里已经备好了自动化工作流,直接拿来就能为 Azure 应用服务、Azure Functions 或 Azure Kubernetes 服务(AKS)搭起 CI/CD 管道。
4、添加和管理数据
内置 MongoDB 与 IntelliSense 支持,让你方便地处理应用数据。既可连接本地或远程 MongoDB 服务器,管理数据库、集合和文档,也能 Azure Cosmos DB 免费层把它们托管到云端。
5、轻松协作
不用改变你或同伴的工作习惯,哪怕大家身处同一间办公室,或者分散在世界各地参与社区开发也一样。编辑器里直接集成了 GitHub 拉取请求扩展,可以完整地编辑和调试拉取请求;配合 Live Share 扩展包,还能在编辑、调试和应用共享时实时配合,方便结对编程或做代码评审。
6、容器
通过这个 Docker 扩展,你可以在 Visual Studio Code 里直接创建、管理并部署容器化应用,还能根据已有的存储库生成 Docker 文件,并统一维护容器、映像和注册表。
7、Kubernetes
Kubernetes 扩展,可以在 Visual Studio Code 里获得完整的 Kubernetes 使用体验,把容器化应用部署到本地或云端的 Kubernetes 集群,并直接调试正在运行的程序。
8、前端 Web 开发
通过 Microsoft Edge 调试器,可将 JavaScript 调试范围延伸至前端开发场景。为前端 JavaScript 代码设定断点并逐步运行,能迅速定位并排除故障;多目标调试能力,前后端代码可一并排查。
9、支持系统
该软件可在 Windows 7、Windows 8 以及 Windows 10 系统上正常使用。
v1.138.0版本
开发容器中的代理会话:在本地开发容器内,为项目工具和依赖项运行代理。
扩展版 Codex 工具:Codex 会话可以跨应用持续使用,用户能在 Copilot 和 ChatGPT 订阅之间选择,并调用 VS Code 工具。
会话清理(预览):已合并的会话会被自动标记为完成,经过一段宽限期后,可以选择性删除这些会话。
(您的评论需要经过审核才能显示)
0条评论