如何在 VSCode 中使用 babel-node 调试 ES6代码

安装@babel/node

npm i @babel/node

目录结构

.
├── .babelrc
├── .vscode
│   └── launch.json
├── package.json

配置launch.json

关键点:

  • 配置runtimeExecutable, 用babel-node来debug
  • 开启sourcemap "sourceMaps": true,
  • 配置env, 不影响babel其他功能
{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "current file",
      "program": "${file}",
      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/babel-node",
      "sourceMaps": true,
      "env": {
        "BABEL_ENV": "debug"
      }
    }
  ]
}


配置.babelrc

说明:
debug对应launch.json中的 "BABEL_ENV": "debug"

{
  "presets": ["@babel/preset-env"],
  "env": {
    "debug": {
      "sourceMaps": "inline",
      "retainLines": true
    }
  }
}


 

©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页