1. 为什么在 VScode 里跑 js 文件总差点意思很多人第一次在 VScode 里写 JavaScript都会遇到一个很别扭的瞬间文件写完了想看看console.log到底打印了什么结果发现 VScode 本身并不会“点一下就跑”。你得打开终端、敲node 文件名.js或者干脆复制到浏览器控制台里试。写十行代码切三次窗口思路全断了。Code Runner 这个插件就是来解决这个问题的。它能在编辑器右上角放一个三角形按钮右键菜单里也有“Run Code”点一下就把当前 js 文件交给 Node 执行输出直接显示在底部的 OUTPUT 面板里。对写算法题、验证小函数、调试一段逻辑来说这种“写完即跑”的体验非常顺。但真正用起来问题往往不在 Code Runner 本身而在两件事上一是运行环境没配好比如 Node 路径不对、终端编码乱码、输出面板不显示二是当你的 js 文件里需要调用大模型接口时Key 的管理变得很散——每个项目一份、每个文件一份改起来烦还容易泄露。这篇就围绕“VScode 中直接运行 js 文件查看结果”这个场景把 Code Runner 的settings.json骨架和统一 Key 通道的接入方式讲清楚让你点一下就能跑跑完就能看到回显。适合谁看刚装好 VScode、想用 Node 跑 js 的新手已经在用 Code Runner 但输出总出问题的同学以及希望把模型调用 Key 统一管理、不想在每个 js 文件里硬编码的开发者。下面从环境准备开始一步步给出可复制的配置。2. TaoToken 前置把 Key 通道先理顺在讲 Code Runner 配置之前先把这个“统一 Key 通道”说清楚。你在 js 文件里调用模型接口时通常需要两样东西一个 API 地址一个 API Key。如果每个小脚本都写一遍时间久了会有两个麻烦一是 Key 散落在各个文件里想换一个得全局搜索替换二是本地文件万一被同步到公开仓库Key 就暴露了。TaoToken 在这里扮演的角色是提供一个统一的接口入口和 Key 管理方式。你可以把它理解成一个“模型调用的统一收发室”你的 js 脚本把请求发到https://taotoken.net/api带上在控制台生成的 Key由它来转发到对应的模型。这样你的代码里只需要维护一个地址和一个 Key换模型、换额度都在控制台操作不用动业务代码。具体要准备的东西不多。先到官网了解整体能力然后进控制台创建 API Key。地址分别是官网入口https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_contentAPI 地址https://taotoken.net/api控制台创建和管理 Keyhttps://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewriteAPI Keys 页面https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi-keysutm_campaignrewrite创建好 Key 之后不要直接写进 js 文件。推荐的做法是放进系统环境变量或者放进 VScode 的settings.json里由 Code Runner 注入。这样你的脚本里读的是process.env.TAOTOKEN_API_KEY而不是一串明文。后面第 3 节会给出具体的配置骨架。注意Key 属于敏感信息不要提交到 Git 仓库也不要在截图或直播里露出完整字符串。控制台里可以随时吊销旧 Key 再生成新的。如果你只是想先验证模型对话能不能通可以先用模型对话页面测一下如果打算长期在 VScode 里写代码调模型建议了解一下 Coding Plan它更适合持续性的编码场景。这两个入口分别是模型对话https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentchatutm_campaignrewriteCoding Planhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding-planutm_campaignrewrite3. 可复制配置Code Runner 的 settings.json 骨架这一节是核心。VScode 的settings.json可以通过CtrlShiftPmacOS 是CmdShiftP打开命令面板输入 “Open User Settings (JSON)” 进入。下面给出一份可以直接参考的骨架重点看code-runner相关的字段和terminal.integrated.env部分。{ code-runner.runInTerminal: true, code-runner.saveFileBeforeRun: true, code-runner.clearPreviousOutput: true, code-runner.showExecutionMessage: false, code-runner.executorMap: { javascript: node, typescript: npx ts-node }, code-runner.executorMapByFileExtension: { .js: node }, terminal.integrated.env.windows: { TAOTOKEN_API_KEY: 你的Key放这里, TAOTOKEN_BASE_URL: https://taotoken.net/api }, terminal.integrated.env.linux: { TAOTOKEN_API_KEY: 你的Key放这里, TAOTOKEN_BASE_URL: https://taotoken.net/api }, terminal.integrated.env.osx: { TAOTOKEN_API_KEY: 你的Key放这里, TAOTOKEN_BASE_URL: https://taotoken.net/api } }逐项说明一下。code-runner.runInTerminal设为true输出会走集成终端而不是 OUTPUT 面板好处是能看到完整的 Node 报错堆栈也方便你输入交互。saveFileBeforeRun保证每次运行前自动保存避免跑了旧代码。clearPreviousOutput让每次输出干净不被上一次的结果干扰。showExecutionMessage关掉之后终端里不会多出一行 “Running code…” 的提示输出更清爽。executorMap里把javascript映射到node这是 Code Runner 默认就会做的但显式写出来更稳。如果你机器上 Node 是通过 nvm 管理的可能需要把node换成绝对路径比如/Users/你的用户名/.nvm/versions/node/v20.x.x/bin/node否则 Code Runner 可能找不到命令。terminal.integrated.env.*这三段是给不同操作系统注入环境变量的。把TAOTOKEN_API_KEY和TAOTOKEN_BASE_URL放进去之后你在 js 文件里就能直接process.env.TAOTOKEN_API_KEY读到不用在代码里写死。注意 Windows、Linux、macOS 要分别配置VScode 会按当前系统读取对应那段。提示如果你不想把 Key 写进settings.json比如这台机器多人用可以改成在系统层面设置环境变量settings.json里只保留TAOTOKEN_BASE_URL。两种方式二选一即可。配置改完记得保存然后重启一下 VScode让环境变量生效。这一步不做的话后面运行 js 时读到的 Key 会是undefined。4. 验证请求写一个 js 文件点一下就跑配置好了来实际验证一次。新建一个文件命名test-run.js内容如下// test-run.js const baseUrl process.env.TAOTOKEN_BASE_URL; const apiKey process.env.TAOTOKEN_API_KEY; console.log(baseUrl:, baseUrl); console.log(apiKey 是否存在:, Boolean(apiKey)); async function main() { const res await fetch(${baseUrl}/v1/chat/completions, { method: POST, headers: { Content-Type: application/json, Authorization: Bearer ${apiKey} }, body: JSON.stringify({ model: gpt-4o-mini, messages: [ { role: user, content: 用一句话说明 Code Runner 的作用 } ] }) }); const data await res.json(); console.log(状态码:, res.status); console.log(模型回复:, data.choices?.[0]?.message?.content); } main().catch((err) console.error(请求出错:, err.message));保存文件然后右键选择 “Run Code”或者按CtrlAltN。如果你用的是较新的 Node18 及以上fetch是内置的不需要额外装包。运行后终端里应该先看到两行环境变量检查然后看到状态码和模型回复。实测下来第一次跑最容易卡在环境变量上。如果apiKey 是否存在打印的是false说明settings.json里的环境变量没生效回去检查是否重启了 VScode、Key 是否填在了对应系统的段落里。如果状态码是 401说明 Key 无效或没带上如果是 404检查baseUrl后面拼接的路径是否正确。成功的话你会看到类似这样的输出baseUrl: https://taotoken.net/api apiKey 是否存在: true 状态码: 200 模型回复: Code Runner 让你在 VScode 里一键运行代码并直接查看输出结果。到这一步就说明“VScode 中直接运行 js 文件查看结果”这条链路已经通了Code Runner 负责触发Node 负责执行TaoToken 负责模型调用环境变量负责 Key 的统一注入。整个过程你只需要点一下按钮。5. 本篇常见错排查即使配置看起来没问题实际跑的时候还是会遇到一些典型报错。下面按现象整理几个高频问题和处理方式。现象一右键没有 “Run Code” 选项。通常是 Code Runner 插件没装好或没启用。到扩展面板搜索 “Code Runner”确认已安装并处于启用状态。如果装了但菜单里没有检查一下当前文件的语言模式是不是被识别成了纯文本右下角点一下改成 JavaScript。现象二终端报node: command not found。说明 Code Runner 找不到 Node。先在系统终端里执行node -v确认 Node 本身可用。如果系统终端能用但 VScode 里不行多半是路径问题把executorMap里的node换成which node查到的绝对路径。现象三输出中文乱码。Windows 上比较常见是终端编码问题。可以在settings.json里加上terminal.integrated.defaultProfile.windows: Command Prompt或者把终端编码切到 UTF-8。另一个办法是在 js 文件开头不写中文注释先排除是文件编码还是终端编码的问题。现象四process.env.TAOTOKEN_API_KEY是 undefined。这是环境变量没注入。确认三件事settings.json里对应系统的段落写对了改完重启了 VScode没有在多个 settings 文件里被覆盖。如果用的是工作区设置工作区的优先级高于用户设置检查一下工作区里有没有同名变量。现象五请求一直挂起或超时。先确认TAOTOKEN_BASE_URL拼出来的地址能访问再确认网络环境正常。如果状态码返回 429说明触发了频率限制等一会儿再试或者到控制台看看额度情况。现象六fetch is not defined。说明 Node 版本低于 18。两个选择升级 Node 到 18 以上或者用node-fetch之类的库替代。升级 Node 更省事也顺便拿到更好的性能。注意排查时优先看终端里的完整报错不要只看最后一行。Node 的堆栈信息会告诉你具体是哪一行、哪个变量出的问题。6. 把 Key 通道固定下来之后只管写代码配置这件事做一次就够了。把 Code Runner 的settings.json骨架和 TaoToken 的环境变量固定下来之后你后面在 VScode 里写任何 js 小脚本都可以直接右键运行、直接看回显不用再关心 Key 从哪来、地址写没写对。如果你还没创建 Key可以到 API Keys 页面生成一个然后按第 3 节的骨架填进settings.json。接入过程中遇到报错可以对照接入文档里的说明逐项核对。文档入口是接入文档https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewriteAPI Keyshttps://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi-keysutm_campaignrewrite如果你主要在 VScode 里做长期编码、写 Agent 或者频繁调模型建议看一下 Coding Plan它比按次调用更适合这种持续性的工作流Coding Planhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding-planutm_campaignrewrite最后留一个我自己的习惯每次新建 js 脚本第一行先console.log(process.env.TAOTOKEN_BASE_URL)确认环境变量读到了再往下写业务逻辑。这个动作只花两秒但能省掉后面十分钟的排查。