ES6でデバッグする
問題
- VSCodeをデフォルトで使うと、ES6のJSをデバッグ実行するとSyntaxError: Unexpected token importのようなエラーが起きる。
解決方法
bable-cliとbabel-preset-envのインストール
npm install -D babel-cli
npm install -D babel-preset-env
launch.jsonの設定
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch via Babel",
"program": "${workspaceRoot}\\index.js",
"runtimeExecutable": "${workspaceRoot}\\node_modules\\.bin\\babel-node",
}
]
}
- プロジェクトフォルダ直下の.vscode/launch.jsonを開く。
- (存在しない場合は、VSCodeを起動して、左のアクティビティからデバッグビューを選び、歯車アイコンをクリックする)
- runtimeExecutableの項目を追加する。
.babelrcの設定
{
"presets": [
[
"env", {
"targets": {
"node": "current"
}
}
]
]
}
- プロジェクトフォルダ直下の.babelrcを上のようにする。
注意
- babel-nodeでエラーが起きた場合は、いったんnode_modulesを消して、babelをインストールしなおすといいかも。
参考