vscode 安装教程 2026

官网下载 exe
官网链接

按步骤安装 改下安装地址 就可

另外 选择附加任务 全部勾上

将 "通过 Code 打开" 添加到 文件 右键菜单右键单个文件 → 直接用 VSCode 打开编辑，不用先开软件再拖文件。

将 "通过 Code 打开" 添加到 目录 / 文件夹 右键菜单右键整个项目文件夹 → 一键用 VSCode 打开整个项目，开发最常用。

将 Code 注册为受支持的文件类型的编辑器以后 .java .html .css .js .md 等代码文件，双击默认就用 VSCode 打开，不跳记事本。
添加到 PATH（重启后生效）【最核心】把 VSCode 加入系统环境变量：
任意 CMD/PowerShell 输入 code 就能直接启动

输入 code . 直接打开当前文件夹为项目

后面你学 Java、前端、Git 都依赖这个，不勾以后各种命令行用不了

安装中文语言包

首次启动是英文界面，先装中文包，降低学习门槛：

点击左侧边栏的「扩展」图标（快捷键 Ctrl+Shift+X / Mac Command+Shift+X），打开插件市场

在搜索框输入 Chinese (Simplified)，找到微软官方出品的「中文 (简体) 语言包」

点击【Install】安装 点击右下角重启就好了

其他相关插件安装

1. Vue - Official

   完美支持 .vue 单文件组件 (SFC)：<template>/<script>/<style> 三部分独立语法高亮、智能补全；

   对 Vue3 <script setup> 语法、组合式 API（setup/reactive/ref/computed）提供专属极致提示；

   兼容 Vue2 Options API，自动识别 data/methods/watch/computed 等配置；

   支持 TS 类型推导、JSX 语法适配，完美兼容 Vue3+TS 开发；

   内置基础格式化能力，可联动其他格式化工具。

2. Vue 3 Snippets

   覆盖 Vue2/Vue3 全语法 的快捷代码片段，支持 Options API、Composition API、<script setup> 三种写法；

   输入极简缩写，一键生成完整代码块，99% 的 Vue 代码场景都能覆盖；

   适配 Vue3 最新语法：defineProps/defineEmits/defineExpose/useRouter 等。

必背快捷指令

v3setup → 生成 Vue3 <script setup> 完整模板 首选

v3sc → 生成带样式隔离的 Vue3 完整组件（

<template>+<script setup>+<style
> scoped>

）v3comp → 生成 Vue3 组合式API 组件模板 v3ref → 快速生成 const xxx =

ref(initialValue) v3reactive → 快速生成 const xxx = reactive({})

v2 → 生成 Vue2 完整组件模板 v2data → 快速生成 data() { return {}

3. Auto Import - ES6, TS, JSX, TSX

   写 Vue 内置 API（ref/reactive/computed）、自定义组件、第三方库（VueRouter/Pinia）时，自动检测未导入模块，一键补全 import 语句；

   自动移除未使用的导入，解决 Vue 项目中 import 冗余、手动删导入的麻烦；

   支持 webpack/vite 别名路径（如 @/components/Header）的自动导入，适配工程化项目配置。

4. Path Intellisense

   输入 .//...//@/ 时，自动联想文件 / 文件夹，支持组件、图片、样式、工具类等所有文件类型；

   完美适配 Vue 项目的别名路径（如 @ 指向 src），再也不用手动拼路径；

   支持绝对路径、相对路径、模块路径的智能补全，杜绝「路径错误导致的组件加载失败」。

5. Prettier - Code formatter（代码格式化统一标准）

   一键格式化 .vue/.js/.ts/.css/.less/.scss/.json 所有文件，统一团队代码风格，杜绝格式混乱；

   支持保存自动格式化，无需手动操作，适配 Vue 单文件组件的三部分独立格式化；

   完美兼容 Vue3

如有其他问题，欢迎在评论区留言讨论！