Basta ya de buscar por todo internet porque llegaste al lugar adecuado, poseemos la respuesta que necesitas pero sin complicaciones.
Angular usa webpack y todos los archivos de script de tipo se enumeran debajo de él. Para seleccionar su archivo TypeScript de destino, la herramienta para desarrolladores de Chrome (F12). Vaya a la pestaña Fuente y seleccione “webpack://”->”.”->”src/app” -> su archivo mecanografiado (consulte el archivo de imagen).
Luego configure el marcador de línea de depuración en el archivo ts y use la función de teclado java script normal (F8, F10, F11, etc.) para depurarlo.
Pasos:
- Abra la herramienta para desarrolladores de Chrome F12.
- prensa control+PAGS en Chrome Dev Tools para buscar un archivo TS y abrirlo.
Además, puede copiar el nombre del archivo del código y pegarlo en el cuadro de entrada de búsqueda.
Este es el mejor enfoque.
Si está utilizando Angular con código VS y desea depurar en el navegador Chrome, siga este paso
1) Instalar la extensión del depurador de Chrome
2) Después de la instalación, el ícono del complemento de depuración aparecerá en el panel izquierdo. Haga clic para obtener la nueva ventana.
3) Ahora seleccione Depurar-> Agregar configuración. Esto creará un archivo Launch.json con valores preestablecidos. Actualízalo con tu URL y número de puerto.
4) Ahora regrese a su código y agregue un punto de interrupción donde lo desee.
5) Inicie su aplicación en la terminal (npm start). Seleccione el botón de complemento de depuración nuevamente desde el panel izquierdo. tendrá todos los puntos de interrupción enumerados.
6) Seleccione la opción Depurar-> Iniciar Chrome contra localhost. Esto abrirá una ventana separada del navegador Chrome y en vscode, el botón de controles de depuración aparecerá de manera similar a Visual Studio; alternativamente, también puede usar los botones del teclado para depurar el código. Ver la imagen de abajo
Si haces scroll puedes encontrar las crónicas de otros usuarios, tú aún tienes el poder mostrar el tuyo si te apetece.