こんにちは!
シタテル株式会社CTOの和泉です。
シタテルではフロントエンドの開発にNuxt.jsを使っています。
デバッガをかけてたいときはどうしたらいいんだろうと思って調べていたら良さそうなやり方を見つけたので自分の記録がてら書いておきます。
参考:
https://codeburst.io/debugging-nuxt-js-with-visual-studio-code-724920140b8f
手順
Nuxt.jsのプロジェクトを作る部分は割愛します。
1. package.json に コマンド追加
"scripts": {
"debug": "node --inspect node_modules/.bin/nuxt",
2. デバッガの設定
画像左下の虫マークをクリック
図中「Launch Program」右の歯車をクリックして実行設定を開く
右下「Add Configuration」をクリックして「Launch via NPM」を選択すると実行設定が追加されます。追加後はlaunch.json
ファイルを保存してください。
3. デバッガの実行
追加された「Launch via NPM」を選択して再生ボタンを押すとデバッガが実行されます。
ブレークポイントは debugger
と記述
ブレークしたところで変数などを確認できます。
以上、簡単ですがNuxt.jsにデバッガをかけられるようになりました。