Shulou(Shulou.com)06/02 Report--

This article mainly introduces the method of debugging Vue code in VSCode, which is very detailed and has certain reference value. Friends who are interested must finish it!

Step to open vscode Install Debugger for Chrome use vue cli3 to create vue application project root path add "vue.config.js" file module.exports = {configureWebpack: {devtool: 'source-map'}} .vscode file launch.json add: "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} / *"}]} set a breakpoint to open your favorite terminal in the root directory and use Vue CLI to open the application:

Npm run serve goes to the Debug view, selects the "vuejs:chrome/firefox" configuration, and then press F5 or click the green play button.

With a new browser instance opening http://localhost:8080, your breakpoint should now be hit. This is all of the article "how to debug Vue code in VSCode". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.