VSCodeVim开发者实战从yarn build到Docker测试提交你的第一个PR完整流程【免费下载链接】Vim:star: Vim for Visual Studio Code项目地址: https://gitcode.com/gh_mirrors/vim/VimVSCodeVim 是 Visual Studio Code 中最流行的 Vim 键位扩展让编辑器拥有完整的 Vim 模态编辑体验。这篇文章带你以开发者视角走通 VSCodeVim 的完整开发流程安装环境、yarn build构建扩展、用 Docker 跑自动化测试直到提交你的第一个 Pull Request适合想要参与开源的新手。一、先认识项目VSCodeVim 的架构长什么样在动手之前花两分钟了解项目结构能帮你快速找到该改哪个文件入口extension.ts 负责扩展激活所有按键从这里流入状态机src/mode/modeHandler.ts 是核心状态机每个打开的编辑器一个实例Vim 状态src/state/vimState.ts 保存每个编辑器的光标、寄存器、模式与历史动作实现src/actions/目录存放所有命令、运动motion和操作符operator命令解析src/cmd_line/处理:开头的 Ex 命令。官方维护的项目说明书是 AGENTS.md其中 Build Test 一节列出了本文所有命令强烈建议先读一遍。二、一键安装 VSCodeVim 开发环境开发前需要准备 4 样东西完整要求见 .github/CONTRIBUTING.md工具版本要求是否必须Visual Studio Code最新稳定版✅Node.jsv22.x 及以上✅Yarn1.x经典版✅Docker社区版即可可选推荐 然后克隆仓库并安装依赖git clone https://gitcode.com/gh_mirrors/vim/Vim cd Vim yarn install code . # 用 VS Code 打开项目 小技巧依赖锁定在 yarn.lock 中yarn install能还原出与 CI 完全一致的依赖版本避免我本地是好的问题。三、yarn build 快速上手3 个最常用的构建命令构建脚本定义在 package.json 的scripts字段中日常开发只需要记住这 3 个yarn build-dev— 快速开发构建几秒出结果日常首选yarn build— 生产构建速度较慢发布前或跑测试前用yarn watch— 监听模式保存文件自动重新构建边改边试最舒服。构建本质是运行 webpack.config.js生产和 webpack.dev.js开发两套配置产物输出到out/目录。构建完成后可通过 VS Code 的Run and Debug运行与调试面板启动扩展宿主窗口你的改动会即刻生效。四、Docker 自动化测试为什么推荐npx gulp test改完代码测试是提交前最重要的一步。VSCodeVim 的测试采用 Mocha Sinon vscode/test-electron测试目录 test/ 与src/结构一一对应入口是 test/runTest.ts。方式一Docker 容器内运行官方推荐npx gulp test # 在 Docker 中运行全部测试 npx gulp test --grep search # 只跑名称匹配 search 的正则的用例它的工作流程见 gulpfile.js 中的run-test任务先用yarn build-test编译出 JS 产物基于 build/Dockerfile 构建vscodevim镜像——Node 22 基础镜像 Xvfb 虚拟显示让无头环境也能启动 VS Code 测试实例挂载当前目录运行容器容器内自动执行npm run test。好处环境绝对干净一致不受你本机 VS Code 版本、系统图形库影响Mac/Windows/Linux 结果可复现。方式二本机直接运行无 Docker 时yarn build-test yarn test⚠️ 注意运行前必须关闭所有 VS Code 窗口否则测试实例无法启动。五、提交 PR 前必做lint 与代码风格检查CI 会检查代码风格本地先跑一遍能省掉来回返工yarn lint # 检查 ESLint 规则 yarn lint:fix # 自动修复大部分问题 yarn prettier # 统一格式化代码VSCodeVim 有两条容易踩坑的规范详见 AGENTS.md 的 Conventions 一节TypeScript 开启strictnoImplicitOverride重写父类方法必须加override关键字禁止直接调用 Node.js API必须走 src/platform/ 平台抽象层node/browser两套实现这样 Web 版 VS Code 才能正常运行。六、提交你的第一个 PR实用清单 ✅最后一步把改动推上去了。按 Contributing 指南 的建议遵循下面这份清单先开 Issue如果你的 PR 修复/实现的内容没有对应 Issue先创建一个并说明方案小步提交第一次贡献建议从文档、bug 修复、补齐test/用例入手改动小更容易被合入测试要过npx gulp test全绿再推代码填写 PR 模板提交时按模板描述改了什么、怎么测的响应评审被要求修改时用git push更新同一个 PR 分支即可无需重开。从yarn install到npx gulp test全绿你的第一个 PR 就万事俱备了——欢迎加入 VSCodeVim 的维护者行列【免费下载链接】Vim:star: Vim for Visual Studio Code项目地址: https://gitcode.com/gh_mirrors/vim/Vim创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 VSCodeVim开发者实战：从yarn build到Docker测试，提交你的第一个PR完整流程
VSCodeVim开发者实战从yarn build到Docker测试提交你的第一个PR完整流程【免费下载链接】Vim:star: Vim for Visual Studio Code项目地址: https://gitcode.com/gh_mirrors/vim/VimVSCodeVim 是 Visual Studio Code 中最流行的 Vim 键位扩展让编辑器拥有完整的 Vim 模态编辑体验。这篇文章带你以开发者视角走通 VSCodeVim 的完整开发流程安装环境、yarn build构建扩展、用 Docker 跑自动化测试直到提交你的第一个 Pull Request适合想要参与开源的新手。一、先认识项目VSCodeVim 的架构长什么样在动手之前花两分钟了解项目结构能帮你快速找到该改哪个文件入口extension.ts 负责扩展激活所有按键从这里流入状态机src/mode/modeHandler.ts 是核心状态机每个打开的编辑器一个实例Vim 状态src/state/vimState.ts 保存每个编辑器的光标、寄存器、模式与历史动作实现src/actions/目录存放所有命令、运动motion和操作符operator命令解析src/cmd_line/处理:开头的 Ex 命令。官方维护的项目说明书是 AGENTS.md其中 Build Test 一节列出了本文所有命令强烈建议先读一遍。二、一键安装 VSCodeVim 开发环境开发前需要准备 4 样东西完整要求见 .github/CONTRIBUTING.md工具版本要求是否必须Visual Studio Code最新稳定版✅Node.jsv22.x 及以上✅Yarn1.x经典版✅Docker社区版即可可选推荐 然后克隆仓库并安装依赖git clone https://gitcode.com/gh_mirrors/vim/Vim cd Vim yarn install code . # 用 VS Code 打开项目 小技巧依赖锁定在 yarn.lock 中yarn install能还原出与 CI 完全一致的依赖版本避免我本地是好的问题。三、yarn build 快速上手3 个最常用的构建命令构建脚本定义在 package.json 的scripts字段中日常开发只需要记住这 3 个yarn build-dev— 快速开发构建几秒出结果日常首选yarn build— 生产构建速度较慢发布前或跑测试前用yarn watch— 监听模式保存文件自动重新构建边改边试最舒服。构建本质是运行 webpack.config.js生产和 webpack.dev.js开发两套配置产物输出到out/目录。构建完成后可通过 VS Code 的Run and Debug运行与调试面板启动扩展宿主窗口你的改动会即刻生效。四、Docker 自动化测试为什么推荐npx gulp test改完代码测试是提交前最重要的一步。VSCodeVim 的测试采用 Mocha Sinon vscode/test-electron测试目录 test/ 与src/结构一一对应入口是 test/runTest.ts。方式一Docker 容器内运行官方推荐npx gulp test # 在 Docker 中运行全部测试 npx gulp test --grep search # 只跑名称匹配 search 的正则的用例它的工作流程见 gulpfile.js 中的run-test任务先用yarn build-test编译出 JS 产物基于 build/Dockerfile 构建vscodevim镜像——Node 22 基础镜像 Xvfb 虚拟显示让无头环境也能启动 VS Code 测试实例挂载当前目录运行容器容器内自动执行npm run test。好处环境绝对干净一致不受你本机 VS Code 版本、系统图形库影响Mac/Windows/Linux 结果可复现。方式二本机直接运行无 Docker 时yarn build-test yarn test⚠️ 注意运行前必须关闭所有 VS Code 窗口否则测试实例无法启动。五、提交 PR 前必做lint 与代码风格检查CI 会检查代码风格本地先跑一遍能省掉来回返工yarn lint # 检查 ESLint 规则 yarn lint:fix # 自动修复大部分问题 yarn prettier # 统一格式化代码VSCodeVim 有两条容易踩坑的规范详见 AGENTS.md 的 Conventions 一节TypeScript 开启strictnoImplicitOverride重写父类方法必须加override关键字禁止直接调用 Node.js API必须走 src/platform/ 平台抽象层node/browser两套实现这样 Web 版 VS Code 才能正常运行。六、提交你的第一个 PR实用清单 ✅最后一步把改动推上去了。按 Contributing 指南 的建议遵循下面这份清单先开 Issue如果你的 PR 修复/实现的内容没有对应 Issue先创建一个并说明方案小步提交第一次贡献建议从文档、bug 修复、补齐test/用例入手改动小更容易被合入测试要过npx gulp test全绿再推代码填写 PR 模板提交时按模板描述改了什么、怎么测的响应评审被要求修改时用git push更新同一个 PR 分支即可无需重开。从yarn install到npx gulp test全绿你的第一个 PR 就万事俱备了——欢迎加入 VSCodeVim 的维护者行列【免费下载链接】Vim:star: Vim for Visual Studio Code项目地址: https://gitcode.com/gh_mirrors/vim/Vim创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考