VSCodeでSpring、vue.jsプロジェクトのデバッグをしたい
解決したいこと
VSCodeでSpring Bootプロジェクト、vue.jsプロジェクトのデバッグをしたいのですが、
ググり方が悪いのか、どうにもやり方が分かりません。
エラーが出たり、ブレークポイントが設定できなかったりします。
ぜひ正しいやり方を教えて頂きたいです
お願いします
発生している問題・エラー
・↓実行・デバッグタブで「Debug Spring Boot」を押下
Failed to attach to remote debuggee VM.Reason:java.net.ConnectException:Connection refused connect
・実行・デバッグタブで「vue.js:chrome」を押下
→chrome起動するが、ブレークポイントが設定できない
「バインドされていないブレークポイント」と表示される
自分で試したこと
・下記の設定で、実行・デバッグタブでデバッグ起動を押下
・vueプロジェクト直下の「vue.config.js」の修正
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
devServer: {
port:8081,
proxy: {
'/': {
target: 'http://localhost:8081', // Spring Boot サーバーのURL
changeOrigin: true,
},
},
configureWebpack: {
devtool: 'source-map'
}
}
})
・.vscodeの「launch.jason」の修正
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "vuejs: chrome",
"url": "http://localhost:8081",
"webRoot": "${workspaceFolder}/src",
"sourceMapPathOverrides": {
"webpack:///./src/*": "${webRoot}/*"
}
},
{
"type": "java",
"name": "Debug Spring Boot",
"request": "attach",
"hostName": "localhost",
"port": 5005
}
]
}
0