【VS Code】彻底解决光标/鼠标点击位置错位问题（含 Cloud Shell 与 Cloud Workstations 解决方案）

前言
在使用 VS Code（包含基于浏览器的 Web IDE，如 Google Cloud Shell Editor 或 Google Cloud Workstations）时，你是否遇到过以下烦人的情况？

鼠标点击某一行代码，光标却落在了几个字符之前或之后。
选中文本时，高亮区域和实际字符边缘不对齐。
删除字符或输入中英文混排、特殊符号时，光标跳动位置发生偏移。
这种情况通常是由于 Monaco Editor（VS Code 核心编辑器）的等宽字体渲染优化算法与当前浏览器环境/系统字体度量差异导致的。本文将介绍该问题的通用解决方案，并给出在 Google Cloud Shell 和 Cloud Workstations 环境下的具体操作步骤。

问题原因
VS Code 编辑器默认开启了针对等宽字体（Monospace Font）的快速测量和渲染优化。然而，在以下场景下该机制容易出现字符宽度计算失误：

使用了包含 CJK（中日韩字符）与英文字符混排的场景。
浏览器缩放比例（Zoom Level）或高 DPI 显示器渲染比例非标准 100%。
远程 Web IDE（Web 版 VS Code）无法精确获取客户端本地字体度量信息。
通过配置 "editor.disableMonospaceOptimizations": true，强制编辑器逐字符精确计算渲染位置，即可彻底解决错位问题。

解决方案

1. 通用 VS Code / Web IDE 界面设置
   无论是在本地 VS Code 还是各类基于浏览器的 VS Code 衍生环境中，都可以直接通过图形界面修改配置：

打开命令面板：
Windows / Linux：Ctrl + Shift + P
macOS：Cmd + Shift + P
输入并回车打开：Preferences: Open User Settings (JSON)
在 JSON 根对象中追加如下配置：

{
  "editor.disableMonospaceOptimizations": true
}

保存文件（Ctrl + S / Cmd + S），设置即刻生效。
2. Google Cloud Shell Editor 解决步骤
在 Cloud Shell Editor（Web IDE）中，既可以通过上述 UI 方法修改，也可以直接在 Cloud Shell 内置终端中写入配置文件：

确保配置目录存在

mkdir -p ~/.theia

将设置写入 settings.json（如果文件已存在请使用 jq 或文本编辑器合并）

cat << 'EOF' >> ~/.theia/settings.json
{
  "editor.disableMonospaceOptimizations": true
}
EOF

注意：如果当前使用的是新版基于 VS Code Server 的 Cloud Shell Editor，配置文件位于 ~/.local/share/code-server/User/settings.json 或 ~/.vscode-remote/data/Machine/settings.json，可通过 UI 面板打开 JSON 最为稳妥。

1. Google Cloud Workstations 解决步骤
   Cloud Workstations 支持 Web 浏览器直连 与 本地 VS Code (Remote - SSH) 两种模式：

模式 A：Web 浏览器端访问（Code-OSS / code-server）
进入 Workstation 的 Web IDE 后：

顶部菜单栏点击 File -> Preferences -> Settings。
点击右上角 “Open Settings (JSON)” 图标。
添加 "editor.disableMonospaceOptimizations": true 并保存。
或者直接在 Workstation 终端中执行：

mkdir -p ~/.local/share/code-server/User
cat << 'EOF' > ~/.local/share/code-server/User/settings.json
{
  "editor.disableMonospaceOptimizations": true
}
EOF

模式 B：通过本地 VS Code (Remote - SSH) 连接
如果你使用本地客户端连接到 Cloud Workstations：

按 Ctrl + Shift + P（或 Cmd + Shift + P）。
输入并选择 Preferences: Open Remote Settings (JSON) (SSH: ...)。
添加 "editor.disableMonospaceOptimizations": true 并保存。
补充建议：调整字体配置（可选）
如果关闭等宽优化后仍有个别中文字符错位，可以显式指定支持良好的等宽字体：

{
  "editor.disableMonospaceOptimizations": true,
  "editor.fontFamily": "'JetBrains Mono', 'Fira Code', 'Courier New', monospace"
}