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

安装 @babel/node

npm i @babel/node

目录结构

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

<!–more–>

配置 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
    }
  }
}
 

givencui 博客首发, 转载请注明来自 GivenCui