Debug a Flask (Python) web application in Visual Studio Code

Question

How do I configure Visual Studio Code to debug a Flask (Python) web application?

For example, when I set the debugger in the view function, it should allow me to step

Answer 1

Here is my configuration for Flask 0.12, Python 3.6, and Visual Studio Code 1.20

// File "launch.json"
{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Flask",
            "type": "python",
            "request": "launch",
            "stopOnEntry": false,
            "pythonPath": "${config:python.pythonPath}",
            "program": "${workspaceRoot}/app.py",
            "env": {
                "FLASK_APP": "${workspaceRoot}/app.py"
            },
            "args": [
                "run"
            ],
            "envFile": "${workspaceFolder}/.env",
            "debugOptions": [
                "RedirectOutput"
            ]
        }
    ]
}

# app.py file
app.run(port=5000)
# Don't use debug=True, because it disables the Visual Studio Code debugger
# app.run(port=5000, debug=True) - disables the Visual Studio Code debugger