#author("2019-01-20T17:54:15+09:00","default:ryuichi","ryuichi")
#author("2019-01-20T17:56:08+09:00","default:ryuichi","ryuichi")
* ES6でデバッグする [#b1c5f0d9]
** 問題 [#edf772d4]
- VSCodeをデフォルトで使うと、ES6のJSをデバッグ実行すると'''SyntaxError: Unexpected token import'''のようなエラーが起きる。
** 解決方法 [#x531ecd8]
*** bable-cliとbabel-preset-envのインストール [#z43a1884]
npm install -D babel-cli
npm install -D babel-preset-env
*** launch.jsonの設定 [#b89eb8c8]
{
"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の設定 [#i74ad0f6]
*** .babelrcの設定 [#e11cf014]
{
"presets": [
[
"env", {
"targets": {
"node": "current"
}
}
]
]
}
- プロジェクトフォルダ直下の.babelrcを上のようにする。
** 注意 [#jdbbedbb]
- babel-nodeでエラーが起きた場合は、いったんnode_modulesを消して、babelをインストールしなおすといいかも。
** 参考 [#m3ddf2b8]
- https://michele.io/nodemon-babel-vscode/
- https://stackoverflow.com/questions/41948471/how-to-debug-nodejses6-code-in-vscode-editor
- https://medium.com/@katopz/how-to-debug-es6-nodejs-with-vscode-8d00bd6c4f94