VSCode为何成为开发者的首选工具？从安装到精通【教程】

VSCode需20分钟配置才能成为首选工具：禁用内置TS/JS服务、正确绑定Prettier格式化、排查Remote-SSH三处依赖。

安装后第一件事：禁用自带 TypeScript/JavaScript 语言服务

VSCode 自带的 TypeScript Server 默认启用，但和项目中实际使用的 typescript 版本不一致时，会出现类型提示错乱、Go to Definition 跳转失败、eslint 报错不生效等问题。

• 打开设置（Ctrl+,），搜索 typescript.preferences.includePackageJsonAutoImports，设为 off
• 搜索 typescript.preferences.enableAutoImportSuggestions，也关掉
• 最关键的：在工作区根目录加 .vscode/settings.json，写入：

  {
    "typescript.preferences.includePackageJsonAutoImports": "off",
    "javascript.preferences.includePackageJsonAutoImports": "off",
    "typescript.preferences.enableAutoImportSuggestions": false,
    "javascript.preferences.enableAutoImportSuggestions": false,
    "typescript.preferences.useAliasesForBuiltinTypes": false
  }

这样能强制让插件（如 ESLint、TypeScript Hero、Import Sorter）接管行为，而不是和内置服务打架。

为什么装了 Prettier 还是格式化不生效？

常见原因是格式化命令没绑定到保存动作，或优先级被其他插件覆盖。VSCode 的格式化链路是：保存 → 触发 formatOnSave → 找当前语言的默认 formatter → 检查是否启用 → 执行。

Teleporthq

一体化AI网站生成器，能够快速设计和部署静态网站

下载

• 确认已安装 Prettier 插件，并在项目里有 .prettierrc 或 prettier.config.js
• 在 .vscode/settings.json 中明确指定语言绑定：

  {
    "[javascript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode",
      "editor.formatOnSave": true
    },
    "[typescript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode",
      "editor.formatOnSave": true
    }
  }

• 如果用了 eslint --fix 风格，别混用；要么全交给 Prettier，要么用 eslint-plugin-prettier + prettier-eslint 统一管道

Remote-SSH 连不上？检查这三处

Remote-SSH 插件不是“连上服务器就能用”，它依赖本地 SSH 配置、远程环境变量、以及 VSCode Server 的静默安装权限。

• 本地 ~/.ssh/config 中主机配置必须含 HostName、User、IdentityFile（不能只靠密码登录）
• 远程机器上运行 echo $PATH，确保 node、npm 在 PATH 里；否则 VSCode Server 启动失败，报错类似 "Failed to fetch remote environment"
• 首次连接时，VSCode 会在远程 ~/.vscode-server 下解压服务端，若磁盘满、权限不足或 SELinux 启用，会卡在 Installing VS Code Server