vscode配置调试npm脚本命令小结

本文介绍如何在VSCode中设置调试环境,通过附加调试器来调试NPM脚本命令,实现前后端开发的解耦,提升开发效率。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言

最近想搭建一个mock数据服务,配合前端进行开发,解耦前端开发和后端开发。

N久之前,用过node-inspector进行调试node,这次希望能够使用vs code来进行调试开发,且是调试npm脚本命令。

 

步骤一:启动NPM脚本命令

package.json如上图,在终端中可执行

npm run mock

  

当需要调试的时候则执行

npm run mock --debug

  

步骤二:配置附加调试器

 {
            "type": "node",
            "request": "attach",
            "name": "启动程序",
            "processId": "${command:PickProcess}"
        }

  

步骤三:执行

 

 

 

转载于:https://www.cnblogs.com/saving/p/10253450.html

### 配置 VSCodenpm 命令的方法 在 Visual Studio Code (VSCode) 中配置 npm 命令涉及多个方面,包括设置环境变量、调整终端类型以及处理潜在的安全策略问题。 #### 1. **确认全局路径** 确保 `npm` 已正确安装并可被系统识别。可以通过以下命令验证: ```bash npm -v ``` 如果此命令可以在 Windows 的 Run (`Win + R`) 或者 CMD 终端中正常返回版本号,则说明全局路径已正确配置[^1]。然而,若在 VSCode 内部的集成终端中运行失败,则可能是由于 VSCode 使用了不同的 shell 导致环境变量未同步。 --- #### 2. **更改默认终端为 CMD** VSCode 默认使用 PowerShell 作为其内置终端。如果遇到无法解析 `npm` 命令的情况,可以尝试将默认终端更改为 CMD: 打开 VSCode 设置文件或通过快捷键访问设置界面: - 方法一:点击菜单栏中的 `File -> Preferences -> Settings`。 - 方法二:按快捷键 `Ctrl+,`(Windows/Linux)或者 `Cmd+,`(MacOS)。 搜索 `terminal.integrated.defaultProfile.windows` 并将其值修改为 `"Command Prompt"`。这会强制 VSCode 使用 CMD 而非 PowerShell[^1]。 --- #### 3. **解决 PowerShell 执行策略限制** 如果继续使用 PowerShell,并且收到类似于 “无法加载文件 D:\nodejs\npm.ps1” 的错误消息,这是因为 PowerShell 的执行策略阻止了脚本运行[^2]。可以通过临时更改执行策略来解决问题: 在 PowerShell 中输入以下命令以允许本地脚本运行: ```powershell Set-ExecutionPolicy RemoteSigned -Scope CurrentUser ``` 注意该操作仅影响当前用户的权限范围,不会对整个系统造成永久性改变。完成之后再次测试 `npm -v` 是否能够正常工作。 --- #### 4. **调试 NPM 脚本** 对于希望利用 VSCode 自带功能调试基于 Node.js 构建的应用程序而言,还需要额外配置 `.vscode/launch.json` 文件[^3]。下面是一个简单的例子展示如何针对特定任务启用断点支持: 创建或编辑项目根目录下的 `.vscode/launch.json` 文件,添加如下内容: ```json { "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Run Script", "runtimeExecutable": "npm", "args": ["run", "start"] } ] } ``` 此处假设存在名为 `start` 的自定义脚本条目于 package.json 文件之中。实际应用时需依据具体情况替换参数部分。 --- #### 5. **附加注意事项** 尽管可以直接调用 `npm run <script>` 来触发各种构建工具链上的动作,但对于长期维护大型项目的开发者来说,推荐单独设立专用的服务进程管理者比如 PM2 等来进行后台服务控制[^3]。这样不仅便于监控状态还能简化跨平台部署流程。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值