ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

CPH:用VS Code打通LeetCode刷题全流程

CPH:用VS Code打通LeetCode刷题全流程 刷题这件事真正拉开差距的从来不只是“能不能想出解法”还包括“能不能快速把思路变成可运行的代码并确认正确”。用 LeetCode 做题时很多人长期被困在网页编辑器里提示弱、自动补全差、样例复制来复制去好不容易本地跑通还得把代码原样粘回提交框。一旦开始按 LeetCode 热门 100 题、周赛题单批量练习这种割裂感会被放大到影响刷题节奏。CPH 正是用来消除这段割裂的工具。CPH 的全称是 Competitive Programming Helper它表面上是一个 VS Code 扩展实际上由“VS Code 扩展 浏览器扩展”两部分组成。它的价值不是替你写题而是把“读题、写代码、跑样例、提交”串成一条顺畅链路在浏览器打开 LeetCode 题目点一下扩展图标题目和测试用例就会进入 VS Code本地写完代码后一键运行官方样例直观看到哪条用例通过、哪条失败确认无误后还能直接提交回 LeetCode。对经常参加周赛、按题单刷题或者希望长期维护刷题记录的开发者来说这个工具能明显减少重复劳动。这篇文章会从 CPH 的设计结构开始讲起再带你完成“安装扩展 - 抓取题目 - 编写解答 - 运行样例 - 提交 LeetCode”的完整闭环最后补充参数配置、常见问题排查和一套可以长期用的刷题工作流。1. 理解 CPH 的定位它解决的是刷题过程中的环境割裂1.1 为什么网页刷题和本地写代码会割裂LeetCode 网页编辑器本身可以完成基础编码但它的定位是简洁在线评测不是完整 IDE。实际刷题时你会遇到几类反复出现的麻烦代码提示弱结构复杂一点的题目很容易写错方法名或参数类型。本地验证要手动复制输入样例再把输出结果粘回网页对照。多道题一起练习时文件没有统一归档复盘时只能靠历史提交记录。提交时经常忘记带上from typing import List这类导入导致本地正常、线上编译失败。周赛时还要同时盯着多个标签页频繁切回提交框容易漏掉代码片段。这些问题单个看都不大但每天刷 3 到 5 道题时额外消耗的时间和注意力非常可观。CPH 的工作方式是把你熟悉的 VS Code 变成主要操作界面而浏览器只负责“打开题目”和“最终提交”这样两份工具各司其职。1.2 CPH 不是单个扩展而是一对协作组件CPH 的完整链路由两个部分组成缺一不可。VS Code 端扩展负责核心逻辑接收浏览器推送的题目信息生成模板文件保存测试样例运行评测对比结果以及触发提交。浏览器端扩展叫 Competitive Companion竞赛伴侣负责读取当前打开的题目页面提取题目标题、描述、输入输出样例、时间限制等资料然后发送给 VS Code 端扩展。你可以把这种设计理解为“浏览器采集数据VS Code 消费数据”。这样做的好处是题目解析逻辑不需要内嵌在编辑器里只要 Competitive Companion 支持某个题库CPH 就能复用同样的测试、提交流程。这也是为什么 CPH 不只支持 LeetCode也能覆盖 Codeforces、AtCoder、HackerRank、Topcoder 等多个平台。1.3 CPH 支持哪些平台和场景不同类型的题目平台对 CPH 的接入程度不完全一样。常见支持情况如下平台抓取题目运行样例提交代码适用场景LeetCode支持支持支持日常刷题、周赛赛前练习Codeforces支持支持支持常规 Div.2 / Div.3 练习AtCoder支持支持支持ABC / ARC 等比赛HackerRank支持支持视情况算法与面试题练习Topcoder支持支持视情况传统竞赛题即使某些平台只支持抓题和本地评测不支持一键提交CPH 也能作为“本地调试器”使用把题目稳定保存到磁盘用自己熟悉的环境写题最后再回到网页提交。注意不要一上来就追求把所有平台接通。第一次使用 CPH 时优先把 LeetCode 这一条链路跑通理解抓题、测试、提交三个环节分别对应哪个组件再去扩展其他平台会顺利得多。1.4 CPH 工作流与传统刷题流程的对比环节传统网页刷题CPH 工作流阅读题目网页阅读浏览器阅读题目信息自动进入 VS Code编写代码网页编辑器VS Code 本地编辑器提示完整运行样例手动粘贴输入再对比输出一键运行全部样例并标记差异构造边界数据需要手动添加到代码里可在测试面板添加自定义样例提交代码手动复制粘贴由扩展通过浏览器会话提交题解归档依赖 LeetCode 收藏夹题目文件保存在本地便于复盘对比之后能发现CPH 并不是把提交过程变“神奇”而是把刷题过程中琐碎的重复动作统一收纳到 VS Code 里。2. 安装与前置配置VS Code 扩展和浏览器扩展必须配对完成2.1 安装 VS Code 侧扩展打开 VS Code进入扩展市场搜索Competitive Programming Helper通常第一个结果就是由 Divyanshu Agrawal 维护的扩展。也可以直接在命令面板执行安装code --install-extension DivyanshuAgrawal.competitive-programming-helper安装完成后VS Code 底部状态栏或活动栏中会出现 CPH 相关入口命令面板里输入CPH可以看到扩展提供的一系列命令。这里有一个容易忽略的点CPH 的抓题和提交都依赖本地网络回环服务。它会在本地监听一个端口通常默认是 4000浏览器扩展把题目数据推送到这个端口VS Code 端扩展再接收。因此如果操作系统防火墙阻止了 VS Code 入站浏览器扩展即使能采集到题目也发送不到 VS Code。2.2 安装浏览器侧扩展 Competitive Companion在 Chrome、Edge 或 Firefox 的扩展商店中搜索Competitive Companion安装到浏览器。安装后浏览器工具栏会多出一个网格图标。这个扩展本身不会主动跑到后台抓取所有网页只有当你打开某个支持的题库页面并点击它时才会读取当前页面中的题目信息。建议安装完成后先做一次简单验证打开任意一个 LeetCode 题目页面点击 Competitive Companion 图标。如果 VS Code 端扩展已经启动并且端口正常VS Code 会在几秒内收到题目信息自动生成题目文件。如果点击后没有反应优先检查三点VS Code 是否已经打开并处于运行状态CPH 扩展是否启用。浏览器扩展是否选择了正确的 VS Code 端口。防火墙是否阻止了本地端口通信。2.3 设置保存位置、默认语言和超时时间CPH 安装后不会自动知道你想用什么语言。第一次使用前建议先在 VS Code 设置里确认三项配置默认语言选你日常刷题的语言。Python 用户直接选 PythonC 用户选 CCPH 会根据语言选择不同的运行方式。保存位置设置题目文件保存的目录便于后续按题目名归档和复盘。测试超时时间单个测试用例允许运行的最长时间默认通常在 10 秒左右。算法题正常在 2 秒内完成如果不是特殊情况不需要刻意调大。你可以在 settings.json 中手动写入类似配置字段名以当前版本扩展实际显示为准{ cph.general.defaultLanguage: python, cph.general.saveLocation: D:/leetcode-problems, cph.general.timeOut: 10000 }这里不要把saveLocation和 LeetCode 网页端的收藏夹混为一谈。此配置只是控制题目在本地磁盘的存放目录。2.4 安装后的环境检查清单完成安装后可以在正式使用前按以下清单检查一遍VS Code 扩展列表中能看到 Competitive Programming Helper且已启用。浏览器扩展 Competitive Companion 已安装工具栏图标可见。在 VS Code 命令面板输入CPH能看到运行测试、提交文件等命令。打开一个 LeetCode 题目页面点击浏览器扩展图标VS Code 能自动生成题目文件。如果题目文件成功生成说明抓题链路已经打通。只要上面第 4 步通过你使用的核心功能已经具备。提交功能可以等跑通本地测试后再尝试不要一开始就同时调试抓题和提交。3. 第一次完整使用抓取题目编写解答运行样例3.1 打开题目并推送到 VS Code在 LeetCode 中找到一道题比方便是我们常说的“热门 100 题”里的简单题先不选择难度太大的题目第一次最重要的是熟悉流程。确认题目已经加载完成然后点击浏览器工具栏的 Competitive Companion 图标。此时 VS Code 端 CPH 会接收题目信息并自动生成如下结构的文件two-sum/ main.py .cph/ problem.json tests/ input_1.txt expected_output_1.txt input_2.txt expected_output_2.txt不同版本生成的目录名和文件名可能略有差异但整体结构类似主文件用于写解答tests目录保存官方样例.cph目录存放题目元数据和提交所需的辅助信息。题目文件生成后VS Code 会自动打开主文件。文件内容通常已经包含一个根据题目语言生成的模板以 Python 为例大致长这样from typing import List class Solution: def twoSum(self, nums: List[int], target: int) - List[int]: # TODO: implement return []这里要注意模板给你的不是“IO 风格”代码而是 LeetCode 的函数签名。也就是说你需要实现的是Solution类中的方法而不是从标准输入读取数据。CPH 运行测试时会负责把输入文件解析成函数参数再调用你的方法。3.2 编写解答并运行样例在生成的主文件中填入解法。以两数之和为例from typing import List class Solution: def twoSum(self, nums: List[int], target: int) - List[int]: seen {} for i, num in enumerate(nums): complement target - num if complement in seen: return [seen[complement], i] seen[num] i return []写完后运行测试。入口位置根据版本不同有两种可能一种是在代码编辑区上方出现一个 Run Tests 按钮另一种是通过命令面板执行CPH: Run Tests运行后CPH 会逐个执行测试样例。每个样例会有三部分信息输入、你的实际输出、期望输出。如果通过样例标记为绿色如果失败标记为红色并在差异区域给出提示方便定位哪一行输出不一致。3.3 理解判定结果结果含义下一步Passed实际输出与期望输出完全一致可以继续加边界样例或直接准备提交Failed输出不一致或运行时报错查看失败样例的输入和期望输出定位差异Timeout超出 CPH 配置的超时时间检查是否死循环或复杂度太高Compile Error编译阶段出错检查语法、导入语句和语言环境第一次看到 Failed 时不要着急改算法先看差异高亮。CPH 在比较输出时会标记第一个不同的字符位置这个信息对定位尾随空格、换行符等问题非常有用。3.4 检查点一个完整的“抓题 - 做题 - 测试”闭环是否成功按以下条件判断浏览器点击扩展图标后VS Code 自动生成了题目文件且包含题目名称。主文件里生成了符合题目要求的函数签名模板。官方样例全部通过至少没有语法错误和导入错误。在测试面板能看到输入、实际输出、期望输出三条信息。如果这些条件都满足你已经可以脱掉“网页编辑器”把日常练习的主战场迁移到 VS Code。4. 测试样例、自定义样例和数据文件算法题调试的核心能力4.1 测试样例是如何组织和运转的CPH 并不是把样例字符串拼进代码里而是在每次运行测试时为你的解答新建一个临时执行环境。它会根据当前语言选择对应的运行命令把input_i.txt作为标准输入或按题目类型传给函数然后捕获程序输出再和expected_output_i.txt做逐字节比较。理解这一层机制很重要。它解释了为什么有些题目本地测试通过提交后却失败LeetCode 的函数题要求返回特定类型的返回值但 CPH 生成测试时可能会通过一个包装脚本调用你的方法。如果你修改了主文件之外的包装逻辑容易造成行为不一致。如果输出比较包含空格、换行等空白字符差异即使算法正确也会显示 Failed。如果题目要求从标准输入读取但模板生成的是函数签名那么你需要在理解题目类型后判断到底该写哪种风格。4.2 添加自定义样例很多题目只给两三组简单样例不足以覆盖边界情况。CPH 的测试面板提供了添加自定义测试用例的入口。通常你可以在一个输入框中粘贴新的输入运行后查看期望输出。常见的做法是构造 3 类特殊样例。最小规模例如数组长度为 1、空数组、n 0。极端值最大整数、负数、字符串为空、全相同元素。边界条件刚好到达目标值、刚好超过目标值、只有一个结果和多个结果等场景。在 LeetCode 函数题中自定义样例的输入形式取决于接口类型。如果是函数题你需要按照函数参数顺序提供参数数据如果是 IO 风格题目则需要提供完整标准输入。这个格式可以在测试面板的提示文本中看到。提示自定义样例是写题能力的一部分。不要因为 CPH 可以一键运行官方样例就忽略自己构造输入的训练。很多隐藏 bug 是在“你觉得应该有答案”但期望输出不太确定时暴露出来的。4.3 小数据调试法的常用经验当某条用例失败时不要一条条打印日志。先看失败用例的输入规模如果规模很小直接在本地把函数调用过程拆开 Debug如果规模较大先缩小用例或改成最小复现。对算法题来说最有效的调试往往不是不断 print而是精确构造一条会失败的最小输入。CPH 的测试面板已经帮你省去了“复制输入、粘贴执行”的动作剩下的调试重点就集中在代码逻辑本身。递归题检查递归出口二分题检查区间收缩条件动态规划题检查 dp 数组的下标边界这类经验比工具本身更重要。5. 提交到 LeetCode原理、操作与失败恢复5.1 为什么提交要依赖浏览器登录状态CPH 不会要求你输入 LeetCode 账号密码也不需要在本地存储敏感凭据。提交功能是通过浏览器里已经登录的会话状态完成的。也就是说当你准备提交时VS Code 端扩展会启动或连接浏览器复用你在 LeetCode 页面中的登录身份把当前文件作为提交内容发送到 LeetCode 评测系统。这种设计的好处是安全。你不用把密码交给第三方扩展也不需要额外配置 Token。代价是如果浏览器未登录、会话过期或者浏览器扩展被禁用提交环节就会失败。5.2 提交的具体流程第一次提交前确保浏览器仍然保持着 LeetCode 的登录状态。随后按顺序操作在 VS Code 中打开刚才生成的题目主文件。运行命令面板中的CPH: Submit Current File或者点击扩展提供的提交按钮。如果浏览器尚未开启CPH 会尝试打开浏览器并引导你确认提交。确认后LeetCode 会返回评测结果结果会显示在扩展面板中。实际看到的按钮文字可能随版本变化但逻辑一致提交前主文件必须对应当前抓取的题目不要在多道题之间混用文件。5.3 提交失败时该怎么排查提交失败不一定是代码问题更多时候是链路问题。常见情况如下现象可能原因处理方式提示未登录或 session expired浏览器登录状态过期回到 LeetCode 网页重新登录再重新提交提交按钮灰色或不可点击当前文件不是通过 CPH 抓取生成的题目文件重新抓取题目使用 CPH 生成的主文件提交后提示题目不匹配手动修改了文件与题目之间的关联信息确认当前文件对应的题目必要时重新抓题提交时连接超时本地端口被占用或浏览器扩展未启用检查浏览器扩展状态重启 VS Code5.4 提交前的验证习惯不要等到提交失败才开始检查。每次提交前可以先问自己四个问题官方样例是否全部通过关键边界样例是否验证过当前文件是否确实对应目标题目浏览器登录状态是否有效这四个问题都不需要额外写代码纯靠使用习惯就能排除绝大多数提交层问题。不要直接复制本地代码到网页再用网页的提交按钮做验证这样会绕过 CPH 的整个工作流。6. 常见问题排查从实际现象倒推原因6.1 点击浏览器扩展后VS Code 没有任何反应这是新手最容易踩的坑。可能原因按出现频率排序VS Code 没有打开或 CPH 扩展没有启用。浏览器扩展连接端口与 VS Code 端不一致。防火墙拦截了本机端口通信。题目页面没有完全加载扩展无法提取题目信息。打开了不支持的页面比如 LeetCode 题库列表页面而不是具体题目页面。处理方式先确认 VS Code 和浏览器都在运行刷新题目页面后重新点击扩展图标。仍然无效时查看 VS Code 输出面板中 CPH 相关日志端口是否监听、是否收到请求都会有记录。检查端口是否正常可以运行下面命令netstat -ano | grep 4000Linux 或 macOS 也可以使用lsof -i :4000只要能看到监听状态说明 VS Code 端服务已经启动。6.2 运行测试时找不到解释器或编译失败现象点击 Run Tests 后输出面板报错例如python: command not found或g: command not found。原因往往是CPH 默认语言配置是 C但你的电脑没有安装 C 编译器或者默认语言配置是 Python但 Python 没有加入系统 PATH。处理方式根据你的实际环境将默认语言改为 Python、Java 等已安装的语言。或者安装对应编译器。配置完成后重新运行一次测试。注意不要只验证程序能启动还要验证输入、输出、异常分支和日志是否符合预期。测试环境本身是否可用同样要在正式写题前验证一次。6.3 提交时提示登录过期或连接失败先用浏览器打开 LeetCode手动登录。登录后再次触发提交。如果仍然失败检查浏览器扩展是否被禁用以及浏览器是否会拦截本地连接。一些浏览器在更新后会重置扩展权限这种情况下重新注册扩展即可。不要删除 CPH 在本地生成的题目文件夹问题通常不出在代码层。6.4 一套可复用的排查顺序清单遇到任何 CPH 相关异常都可以按这个顺序排查输入是否正确当前是否打开了具体题目页面而非列表页。文件是否正确是否使用 CPH 生成的主文件而没有手动改名。组件是否齐全浏览器扩展、VS Code 扩展是否都已启用。端口是否正常CPH 监听端口是否被其他程序占用。依赖是否可用对应语言解释器或编译器是否已安装。登录是否有效浏览器是否能正常打开 LeetCode 并识别登录状态。版本是否存在限制VS Code、CPH 扩展、浏览器扩展是否都更新到兼容版本。如果走到最后仍然无法定位可以打开 VS Code 输出面板查看 CPH 详细日志或者卸载重装扩展。大多数情况下问题都出在组件未启用或浏览器扩展未安装而不是代码本身。7. 设计自己的刷题工作流本地练习、复盘、提交前检查7.1 本地刷题环境和比赛、面试环境的差异CPH 在本地刷题时非常顺手但在正式场景中要清楚它的边界。场景是否适合使用 CPH说明日常 LeetCode 练习适合本地编辑、快速测试、统一归档周赛赛前模拟适合用 CPH 抓题练习充分熟悉题型LeetCode 周赛正赛不建议长期依赖官方编辑器已提供运行样例切换工具浪费时间技术面试在线测评不适合不少测评环境只允许网页内编辑不支持浏览器扩展算法竞赛赛场视规则而定部分赛场允许本地 IDE但扩展通信依赖网络和浏览器风险较高日常练习时可以把 CPH 用到极致但每周至少留出一次不依赖任何 IDE 插件直接在 LeetCode 在线编辑器里完成整场比赛。这样既能保证调试效率也不会让能力绑定在特定工具上。7.2 推荐流程抓题、草稿、测试、复盘长期使用 CPH 时我建议固定成下面这套流程每日从热门 100 题、周赛题或专项题单中选 1 到 3 道题。在浏览器打开题目使用 Competitive Companion 推送确认题目文件生成。先在草稿纸上想清楚暴力解和可行解再开始写代码。本地运行官方样例再补充边界样例。通过全部本地样例后使用 CPH 提交。无论 AC 还是 WA当天晚上花 10 分钟写复盘记录题目类型、思路卡点、时间复杂度和需要复习的地方。这套流程的核心是“题目文件本地化”。因为每个题目都保存在磁盘里复盘时可以直接打开当天的问题而不是依赖 LeetCode 的历史提交记录。7.3 进阶方向题单、周赛和时间管理当你能熟练使用 CPH 后下一步不是继续研究扩展的更多按钮而是研究如何用它支持更有节奏的练习。可以按专题刷热门 100 题每天固定一个专题比如数组、二分、动态规划、图论。也可以选择一道中等难度的题目比如那道经典的《爱吃香蕉的狒狒》——用二分答案或模拟思路练习把它放进你的本地题目库里反复复盘。周赛训练时尽量把周赛当作真实考试在规定时间内完成不打开搜索不中断写题。赛后用 CPH 把当时没做出来的题目抓取到本地再用自己的代码实现一遍对比官方题解的优化点。时间一长你会发现刷题质量比数量更重要。使用 CPH 时还有一个容易被忽略的建议定期清理本地题目目录把已经吃透的题移到归档文件夹把需要复习的题保留在工作目录。文件本身也是一种复习线索目录结构越清晰复盘成本越低。把 CPH 当成刷题工作流的一部分而不是写题的替代品。它省下来的是复制、粘贴、切换窗口的时间省不下来的是理解题目、设计算法和验证边界的能力。第一次用时先跑通一个最简单的闭环然后逐步加入自定义样例、提交和周赛模拟最终形成一套属于自己的稳定节律。
返回列表