Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Node NPM Script RunnerNew to Visual Studio Code? Get it now.
Node NPM Script Runner

Node NPM Script Runner

gkl2013

|
243 installs
| (1) | Free
在 VSCode 工具栏显示 package.json 的 scripts,支持为每个命令配置对应的 Node 版本和 Whistle 代理规则
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Node NPM Script Runner

一个 VSCode 插件,在 Activity Bar 侧边栏展示工作区所有 package.json 的 scripts 列表,支持一键运行/停止,并通过 环境预设(Profile) 统一管理 Node 版本、Whistle 代理规则、自定义环境变量和访问地址,运行脚本时自动切换。

功能特性

  • 📋 Scripts 列表展示 — 自动解析工作区所有 package.json 的 scripts,在侧边栏 TreeView 中展示
  • ▶️ 一键运行/停止 — 点击即可在终端中运行脚本,支持运行状态实时显示(加载动画)
  • 📦 环境预设(Profile) — 将 Node 版本、Whistle 代理规则、自定义环境变量、访问地址打包为可复用的环境预设,一键绑定到脚本
  • 🌐 Whistle 代理集成 — Profile 中配置 Whistle 规则,运行脚本时自动激活对应规则,停止时自动禁用
  • 🔢 自定义环境变量 — Profile 支持配置任意环境变量,运行时自动注入终端
  • 🔗 访问地址 — Profile 支持配置服务访问 URL,方便记录和查看
  • 📁 多 package.json 支持 — 工作区包含多个 package.json 时自动分组展示
  • 🔄 自动刷新 — 监听 package.json 文件变化,自动更新列表
  • 🛠️ 多包管理器 — 支持 npm、yarn、pnpm
  • 🤖 AI 助手集成 — 注册 Language Model Tools,Copilot 等 AI 助手可直接运行/停止脚本、查看状态和环境预设

使用方式

基本操作

  1. 打开包含 package.json 的项目
  2. 点击左侧 Activity Bar 中的 NPM Scripts 图标打开侧边栏面板
  3. 点击脚本名称或右侧的 ▶️ 按钮运行脚本,运行中点击 ⏹ 停止
  4. 点击脚本右侧的 📦 按钮为该脚本绑定环境预设
  5. 点击面板标题栏的 ⚙️ 按钮打开全局设置

环境预设(Profile)

环境预设是本插件的核心概念,将多项运行环境配置打包为一个可复用的组合:

配置项 说明 示例
Node 版本 通过 nvm 切换 Node 版本 v18.19.0、v20.10.0
Whistle 代理规则 自动激活/禁用 Whistle 规则 test-server-rule
环境变量 运行时注入自定义环境变量 API_BASE=https://test.com
访问地址 记录服务的访问 URL http://localhost:3000
描述 备注此 Profile 的用途 连接测试服后端,开启调试模式

创建 Profile

  • 方式一:全局设置(⚙️) → 创建环境预设
  • 方式二:脚本 📦 按钮 → 创建新的 Profile
  • 方式三:命令面板 → Create Environment Profile

绑定 Profile 到脚本

点击脚本右侧的 📦 按钮,从列表中选择已有的 Profile 即可绑定。绑定后脚本描述中会显示 📦 Profile名称。

编辑/删除 Profile

全局设置(⚙️) → 编辑环境预设,可修改 Profile 的各项配置或删除整个 Profile(删除时会自动解除所有脚本的绑定关系)。

全局设置

点击面板标题栏的 ⚙️ 按钮可配置:

  • Whistle 代理端口 — 设置 Whistle 服务端口号
  • 创建/编辑环境预设 — 管理 Profile

运行环境解析

脚本运行时,插件按以下顺序解析环境配置:

绑定的 Profile → 系统默认

  • 如果脚本绑定了 Profile,则使用该 Profile 中的 Node 版本、Whistle 规则、环境变量等配置
  • 如果未绑定 Profile,则使用系统默认环境(不做任何版本切换或代理配置)

Whistle 代理集成

插件同时兼容 Whistle 命令行版 和 Whistle 桌面客户端,采用三层降级策略:

规则激活:

  1. HTTP API — 标准 /cgi-bin/rules/select 接口(命令行版 Whistle)
  2. 桌面客户端 API — /cgi-bin/rules/project + x-whistle-special-auth
  3. w2 命令行 — 最终降级方案

规则禁用:

  1. HTTP API — 标准 /cgi-bin/rules/unselect 接口
  2. 文件系统 — 直接修改 properties 文件中的 selectedList(桌面客户端)
  3. w2 命令行 — 最终降级方案

规则列表获取同样支持 HTTP API 和文件系统两种方式,确保在各种 Whistle 安装方式下都能正常工作。

配置项

配置项 说明 默认值
nodeNpmScript.profiles 环境预设定义,每个 Profile 可包含 nodeVersion、whistleRule、env、url、description {}
nodeNpmScript.scriptProfiles 脚本与环境预设的绑定关系,格式: { "scriptName": "profileName" } {}
nodeNpmScript.nvmDir NVM 安装目录路径 $NVM_DIR 或 ~/.nvm
nodeNpmScript.packageManager 包管理器(npm / yarn / pnpm) "npm"
nodeNpmScript.whistlePort Whistle 代理服务端口号 8899
nodeNpmScript.whistlePath w2 命令路径(默认自动检测) ""
nodeNpmScript.mcpPort MCP Server 监听端口号 3580
nodeNpmScript.mcpAutoStart 插件激活时自动启动 MCP Server false

命令列表

命令 说明 触发方式
nodeNpmScript.runScript 运行脚本 脚本行内 ▶️ 按钮 / 点击脚本名称
nodeNpmScript.stopScript 停止脚本 运行中脚本行内 ⏹ 按钮
nodeNpmScript.configureProfile 为脚本绑定环境预设 脚本行内 📦 按钮
nodeNpmScript.createProfile 创建环境预设 命令面板
nodeNpmScript.editProfile 编辑环境预设 命令面板
nodeNpmScript.globalSettings 打开全局设置 面板标题栏 ⚙️ 按钮
nodeNpmScript.refresh 刷新脚本列表 面板标题栏 🔄 按钮
nodeNpmScript.toggleMcp 启动/关闭 MCP Server 面板标题栏 📡 按钮 / 状态栏

License

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft