Partager via


Utiliser Dev Proxy avec les configurations de débogage de Visual Studio Code

En un clin d’œil
Objectif: Démarrage automatique du proxy de développement lors du débogage dans VS Code
Heure : 10 minutes
Plugins: Divers
Conditions préalables :configurer le proxy de développement, VS Code, l’extension Dev Proxy Toolkit

Installez Dev Proxy Toolkit à partir de la Place de marché d’extension. L’extension fournit des tâches et des surveillants pour le proxy de développement.

Ajoutez le proxy Dev à votre configuration de débogage

Ajoutez les tâches start et stop à votre fichier tasks.json dans votre projet.

Tip

Utilisez les extraits devproxy-task-start et devproxy-task-stop pour ajouter rapidement des tâches de proxy de développement à votre fichier tasks.json.

Fichier : .vscode/tasks.json

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "devproxy-start",
            "type": "devproxy",
            "command": "start",
            "isBackground": true,
            "problemMatcher": "$devproxy-watch",
        },
        {
            "label": "devproxy-stop",
            "type": "devproxy",
            "command": "stop"
        }
    ]
}

Configurez les propriétés preLaunchTask et postDebugTask avec les étiquettes de tâche que vous avez définies dans le fichier tasks.json. Le proxy de développement démarre avant l’exécution de votre application et s’arrête une fois le débogage terminé. L’exemple suivant montre comment configurer le launch.json fichier pour démarrer une session de débogage avec le proxy de développement et une application Node.js.

Fichier : .vscode/launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}/index.mjs",
            "preLaunchTask": "devproxy-start",
            "postDebugTask": "devproxy-stop",
            "env": {
                "NODE_ENV": "development",
                "http_proxy": "http://127.0.0.1:8000",
                "https_proxy": "http://127.0.0.1:8000"
            }
        }
    ]
}

Passer des options au proxy de développement

Vous pouvez transmettre des options au proxy de développement en les ajoutant à la propriété args dans la tâche start du fichier tasks.json. Par exemple, pour démarrer le proxy de développement en mode enregistrement, passez l’argument --record :

Fichier : .vscode/tasks.json (tâche avec arguments)

{
    "label": "devproxy-start",
    "type": "devproxy",
    "command": "start",
    "args": [
        "--record"
    ],
    "isBackground": true,
    "problemMatcher": "$devproxy-watch"
}

Voir aussi