Use FLASK_ENV=development flask run in the terminal to launch Flask. This makes the Flask development server available and enables error feedback and automatic reloading.
Use the F12 key or right-click and choose Inspect to launch the Developer Tools in your browser. The console.log() outputs from your JavaScript code are visible in the Console tab.
From the VSCode Extensions Marketplace, install the Debugger for Chrome extension. Using this extension, you can debug JavaScript by attaching the VSCode debugger to a Chrome instance.
launch.json: To launch Chrome and link it to your Flask application, include the following settings in your launch.json file:
{ "version": "0.2.0", "configurations": [ { "name": "Launch Chrome Flask", "url": "http://localhost:5000", "webRoot": "${workspaceFolder}", "sourceMaps": true } ] }
Press F5 after choosing Launch Chrome against Flask from the VSCode Run panel. By doing this, VSCode will begin debugging your JavaScript code and open Chrome with your Flask app.
Create breakpoints for your application. JavaScript by selecting the line numbers next to them. VsCode will halt execution when the code reaches a break-point, enabling you to step through your code and examine variables.