VisualStudioCode vue.js debug
3285 ワード
優先パラメータ
1.赤い矢印1番RunnadDebugをクリック
2. create a lunch.json fileをクリックしてjsonファイルを作成し、次のjsonコードを入力します。
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "vuejs: chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:///src/*": "${webRoot}/*"
}
},
]
}
3.sourceフォルダのルート(srcフォルダと同じ場所)にvueを設定します。config.次のコードをjsファイルに追加
module.exports = {
configureWebpack: {
devtool: 'source-map',
},
}
4.npm run serveローカルサーバを実行した後、下のrunanddebug画面の▶ボタンをクリックすると、ローカルサーバ8080ポートのWebブラウザが実行され、ブレークポイント矢印部分チェックボックスが選択されているsourceのみがブレークポイントで停止し、値watchで値を表示します
Reference
この問題について(VisualStudioCode vue.js debug), 我々は、より多くの情報をここで見つけました
https://velog.io/@ljwasboy/VisualStudioCode-vue.js-debug
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "vuejs: chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:///src/*": "${webRoot}/*"
}
},
]
}
module.exports = {
configureWebpack: {
devtool: 'source-map',
},
}
Reference
この問題について(VisualStudioCode vue.js debug), 我々は、より多くの情報をここで見つけました https://velog.io/@ljwasboy/VisualStudioCode-vue.js-debugテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol