1 visual studio code 的 extentions 里安裝插件 debugger for chrome
2 devtool: 'eval-source-map', cacheBusting:false
3 chrome 快捷方式 在目標一欄,最后加上 --remote-debugging-port=9222,注意要用空格隔開
4 .vscode 里面放一個 launch.json 文件
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "attach",
"name": "Attach to Chrome",
"port": 9222,
"webRoot": "${workspaceRoot}/src",
"url": "http://localhost:8080",
"sourceMaps": true,
"sourceMapPathOverrides": {
"webpack:///src/*": "${webRoot}/*"
}
}
]
}
5 先點擊chrome快捷方式,啟動調試版的chrome
6 啟動項目,並且在chrome里運行,localhost:8080
7 點擊調試的 綠色三角,用attach方式,map到chrome的localhost:8080 這個地址