Saltar al contenido

¿Mi aplicación Angular no alcanza el punto de interrupción al depurar?

Solución:

¡Esto es lo que estaba pasando! Tiene que ver con la ruta al proyecto en el archivo .vscode y la necesidad de depurar dos carpetas de proyectos separados a la vez.

$ {workspaceFolder}

Tengo dos carpetas para la aplicación

  1. Yogabandy-SPA (aplicación angular)
  2. Yogabandy.API (ASP.Net Core Web API)

Pensé que el mejor lugar para el archivo .vscode era el nivel raíz y, a menos que alguien tenga una solución mejor, este parece ser el mejor lugar.

ingrese la descripción de la imagen aquí

Pero el problema es la ruta de la carpeta del espacio de trabajo que debe corregirse.

Caminos corregidos

"webRoot": "${workspaceFolder}" // old
"webRoot": "${workspaceFolder}/Yogabandy-SPA" // new
"program": "${workspaceFolder}/bin/Debug/netcoreapp2.2/Yogabandy.API.dll" // old
"program": "${workspaceFolder}/Yogabandy.API/bin/Debug/netcoreapp2.2/Yogabandy.API.dll" // new

// removed from the 'server' command so two debuggers don't open, just one
"serverReadyAction": {
  "action": "openExternally",
  "pattern": "^\s*Now listening on:\s+(https?://\S+)"
},

Agregué un compuesto para poder depurar ambos proyectos juntos.

"compounds": [{
  "name": "Server/Client",
  "configurations": ["server", "client"]
}]

Sigo teniendo un problema menor al iniciar el depurador. VS Code muestra esto a continuación, pero ahora puedo depurar ambas aplicaciones juntas y alcanzar todos los puntos de interrupción de ambos proyectos.
ingrese la descripción de la imagen aquí

Si alguien tiene una mejor solución, hágamelo saber.

"compounds": [{
  "name": "Server/Client",
  "configurations": ["server", "client"]
}],
"configurations": [{
    "name": "server",
    "type": "coreclr",
    "request": "launch",
    "preLaunchTask": "build",
    "program": "${workspaceFolder}/Yogabandy.API/bin/Debug/netcoreapp2.2/Yogabandy.API.dll",
    "args": [],
    "cwd": "${workspaceFolder}/Yogabandy.API",
    "stopAtEntry": false,
    "env": {
      "ASPNETCORE_ENVIRONMENT": "Development"
    },
    "sourceFileMap": {
      "/Views": "${workspaceFolder}/Views"
    }
  },
  {
    "type": "chrome",
    "request": "launch",
    "name": "client",
    "url": "http://localhost:4200",
    "webRoot": "${workspaceFolder}/Yogabandy-SPA"
  }

Parece que no ha configurado la extensión del depurador de Chrome en launch.json expediente. de la documentación de vscode:

Necesitamos configurar inicialmente el depurador. Para hacerlo, vaya a la vista de depuración (control+cambio+D) y haga clic en el botón de engranaje para crear un launch.json archivo de configuración del depurador. Elija Chrome en la lista desplegable Seleccionar entorno. Esto creará un launch.json archivar en un nuevo .vscode carpeta en su proyecto que incluye una configuración para lanzar el sitio web.

Necesitamos hacer un cambio para nuestro ejemplo: cambiar el puerto de la URL de 8080 para 4200. Tu launch.json debería verse así:

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

prensa F5 o la flecha verde para iniciar el depurador y abrir una nueva instancia del navegador. El código fuente donde se establece el punto de interrupción se ejecuta en el inicio antes de que se adjuntara el depurador, por lo que no llegaremos al punto de interrupción hasta que actualice la página web. Actualice la página y debería llegar a su punto de interrupción.

El mío, incluso estando en la misma carpeta que el proyecto, solo funcionó al incluir ‘/ src’ en $ {workspaceFolder}.

Directorio de carpetas

Directorio de carpetas

configuración launch.json

configuración launch.json

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *