独书先生 Menu

VSCode 源码学习（1）：本地运行

8月 17, 2023
分类:Web

VSCode 源码学习（1）：本地运行

背景

最近项目架构参考 vscode，准备学习一下 vscode 的源码。第一步就是先跑起来。

操作步骤基本上是参考官方贡献文档来的

VSCode: How to Contribute

这里提炼一些关键步骤。如有不对，请多参考官方文档。

步骤

因为 vscode 编译会用 node-gyp，node-gyp 在 windows 中安装会比较麻烦，所以我的计划是在 WSL 中运行。

  1. 环境准备

    确保你的 WSL 中已经安装好了 git、nodejs、yarn、Python、C++编译工具链

  • Git
  • Node.JS，x64，版本 >=18.15.x 和 <19
  • Yarn 1，版本>=1.10.1和<2，按照安装指南）
  • Python（node-gyp 必需；查看 node-gyp readme 对于当前支持的 Python 版本）
  • 适用于您平台的 C/C++ 编译器工具链：

    “`sh
    sudo apt install python3 python-is-python3 libsecret-1-dev libxss1 libx11-dev libxkbfile-dev libasound2 libgtk-3-0 libgdk-pixbuf2.0-0 libnss3 libxtst6 libxi6 libxdamage1 libxcursor1 libxcomposite1 libx11-xcb1 libgbm1
    “`

  • 推荐使用 VSCode 来开发。安装 VS Code 和 Remote – WSL 扩展。

  1. 安装依赖

    yarn

    yarn安装成功

  2. 启动 electron

    ./scripts/code.sh --no-sandbox

    第一次执行比较慢，多等待一会，大概 2 分钟后就能启动了。
    code.sh执行成功

报错

执行./scripts/code.sh报错

可能是刚开始没有安装 C++工具链，执行./scripts/code.sh报了一些错误

找不到 ternary-stream 模块

Error: Cannot find module 'ternary-stream'

找不到 vscode-gulp-watch 模块

Error: Cannot find module 'vscode-gulp-watch'

gssapi.h 错误

../src/unix/kerberos_gss.h:21:14: fatal error: gssapi/gssapi.h: No such file or directory

基本上安装好 C++依赖就没有了。

yarn 安装依赖的时候报 gyp 错误

还有一个常见的 node-gyp 错误

/bin/sh: 1: pkg-config: not found
gyp: Call to 'pkg-config --cflags libsecret-1' returned exit status 127 while in binding.gyp. while trying to load binding.gyp
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code: 1

我尝试清除依赖后重新安装依赖就好了

# 清除依赖
git clean -xfd
# 重新安装依赖
yarn

提示not a valid Electron app

这是官方提醒的报错，注意一下就行，需要执行

yarn watch

参考