预见猿份
主题
首页面试题在线工具关于我们老苗一对一私教学员评价
实战项目
项目前置基础创新WMS项目Java微服务框架与实战云岚到家项目闪聚支付项目学成在线项目青橙电商项目JVM原理与实战调优分布式事务专题Java高频面试题MySQL从入门到精通Java数据结构与算法Java 并发编程(JUC)实战课程老苗一对一私教学员评价blog
blog
  • Java web开发教程

    • 课程介绍
    • day01 - web开发介绍
    • day01 - 前端Web开发(HTML+CSS)
    • day01 - VsCode安装文档
    • day02 - 前端Web开发(JS+Vue+Ajax)
    • day03 - Web后端基础(Maven基础)
    • day04 - Web后端基础(基础知识)
    • day05 - Web后端基础(数据库)
    • day06 - Web后端基础(java操作数据库)
    • day07 - 后端Web实战(部门管理)
    • day08 - 后端Web实战(员工管理)
    • day09 - 后端Web实战(员工管理)
    • day10 - 后端Web实战(员工管理)
    • day11 - 后端Web实战(自己实战)
    • day12 - 后端Web实战(登录认证)
    • day13 - 后端Web进阶(AOP)
    • day14 - 后端Web进阶(Maven高级)
    • day15 - 前端Web实战(Vue工程化+ElementPlus)
    • day16 - 前端Web实战(Tlias案例-部门管理)
    • day17 - 前端Web实战(Tlias案例-员工管理)
    • 附 - 项目接口文档







----- 到底线了 -----

VsCode安装文档 ​

下载 ​

进入VS Code官网:https://code.visualstudio.com,点击 DownLoad for Windows下载windows版本

当然也可以点击旁边的箭头,下载Windows版本 或 Mac OS 版本

备注:

  • Stable:稳定版
  • Insiders:内测版

📌 注意:上述下载软件安装包的过程,大家可以不用操作,因为在提供的课程资料中,已经为大家准备好了安装包 。

安装 ​

  • 双击安装包,选择 我同意此协议,再点击 下一步

  • 选择安装路径(也可以使用默认值: C:\Users\super\AppData\Local\Programs\Microsoft VS Code),点击下一步 。

  • 继续点击下一步

  • 勾选创建桌面快捷方式,如果不想使用vscode作为代码默认打开方式,可以取消将code注册为受支持的文件类型的编辑器,点击下一步

  • 点击安装,开始安装

  • 安装完成,运行VS Code。

  • 点击左下角的 "设置" -> "主题" -> "主题颜色",然后可以根据自己的喜好,选择喜欢的主题颜色。

VsCode插件安装 ​

VS Code提供了非常丰富的插件功能,根据你的需要,安装对应的插件可以大大提高开发效率。

完成前端开发,常见插件介绍:

Chinese (Simplified) Language Pack ​

适用于 VS Code 的中文(简体)语言包

安装完毕之后,点击右下角的 "Change Language and Restart" 按钮,重新启动服务。

HTML CSS Support ​

在编写样式表的时候,自动补全功能大大缩减了编写时间。

JavaScript (ES6) code snippets ​

支持ES6语法提示

Mithril Emmet ​

一个能大幅度提高前端开发效率的一个工具,用于补全代码

Path Intellisense ​

路径提示插件

Vue 3 Snippets ​

在 Vue 2 或者 Vue 3 开发中提供代码片段,语法高亮和格式化的 VS Code 插件,能极大提高你的开发效率。

Auto Close Tag ​

自动闭合HTML/XML标签

Auto Rename Tag ​

自动完成另一侧标签的同步修改

open in browser ​

vscode不像IDE一样能够直接在浏览器中打开html,而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件,支持自定义打开指定的浏览器,包括:Firefox,Chrome,Opera,IE以及Safari

Live Server ​

一个具有实时加载功能的小型服务器,也就是说我们可以在项目中实时用live-server作为一个实时服务器实时查看开发的网页或项目效果。

Vue - Official ​

一个专门为 Vue 3 构建的语言支持插件。

File Utils ​

File Utils插件,可以方便快捷的来创建、复制、移动、重命名文件和目录。

IntelliJ IDEA Keybindings ​

安装VSCode的插件 IntelliJ IDEA Keybindings 即可在VSCode中使用IDEA的快捷键。

TONGYI Lingma ​

通义灵码,是一款基于通义大模型的智能编码辅助工具,提供行级/函数级实时续写、自然语言生成代码、单元测试生成、代码注释生成、代码解释、研发智能问答、异常报错排查等能力,并针对阿里云 SDK/API 的使用场景调优,为开发者带来高效、流畅的编码体验。

AI助手账号注册:https://account.aliyun.com/register/qr_register.htm?spm=5176.29741907.J_4VYgf18xNlTAyFFbOuOQe.d_register_1.e939154ab73d0j&oauth_callback=https%3A%2F%2Fwww.aliyun.com%2F

VsCode配置 ​

打开配置面板,根据自己的喜好,可以修改字体、背景样式等偏好设置。 点击 "设置" 按钮。

然后点击右上角 "打开设置" 的图标。

然后在打开的 settings.json 中增加如下配置信息:

JSON
{
  "workbench.colorTheme": "Default Light+",
  "workbench.statusBar.visible": false,
  "editor.fontFamily": "'Courier New', Consolas, monospace",
  "editor.fontSize": 15,
  "editor.lineHeight": 1.8,
  "editor.tabSize": 2,
  "editor.codeActionsOnSave": {
    "source.fixAll": "explicit"
  },
  "editor.minimap.enabled": true,
  "liveServer.settings.donotShowInfoMsg": true,
  "git.confirmSync": false,
  "terminal.integrated.defaultProfile.windows": "Command Prompt"
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

具体配置项的含义,鼠标放在配置项上,会自动悬浮展示出来。

← day01 - 前端Web开发(HTML+CSS)day02 - 前端Web开发(JS+Vue+Ajax) →








如果发现文档内容有错误或排版错乱,请及时联系站长老苗修改,不胜感激。联系我们
关于我们 | 隐私政策 | 豫ICP备2026003386号-4 | 豫公网安备41010202004008号
目录

本页无章节