"Chrome Debugger" está en desuso, así que básicamente, con VsCode actualizado a la última versión y solo con "Javascript Debugger" incorporado, la buena práctica se explica en la "página principal del libro de recetas de github de vscode" :

Depuración de Chrome/Edge con Angular CLI

Y yendo directo al grano, con solo launch.json básico como este:

 { "version": "0.2.0", "configurations": [ { "name": "ng serve", "type": "chrome", "request": "launch", "preLaunchTask": "npm: start", "url": "http://localhost:4200", "webRoot": "${workspaceFolder}" } ] }

Y agregando un archivo task.json (en la misma carpeta de launch.json ):

 { "version": "2.0.0", "tasks": [ { "type": "npm", "script": "start", "isBackground": true, "presentation": { "focus": true, "panel": "dedicated" }, "group": { "kind": "build", "isDefault": true }, "problemMatcher": { "owner": "typescript", "source": "ts", "applyTo": "closedDocuments", "fileLocation": [ "relative", "${cwd}" ], "pattern": "$tsc", "background": { "activeOnStart": true, "beginsPattern": { "regexp": "(.*?)" }, "endsPattern": { "regexp": "Compiled |Failed to compile." } } } }, ] }

eres bueno para ir. Dado que su proyecto está configurado correctamente, simplemente presione F5 y estará listo para comenzar con los puntos de depuración identificados en su vscode. Probado con el proyecto Angular 13.

Los Crbug/1173575, non-JS module files deprecated. chromewebdata/(index)꞉5305:9:5551 El error de VS Code normalmente se asocia con la entrada de inicio de su aplicación en el archivo launch.json .

La solución parece ser instalar primero Ritwick Dey, Live Server . Esto normalmente se inicia y escucha en el Port 5500 . Una vez que se haya iniciado Live Server, puede editar su archivo launch.json para incluir el puerto de Live Server , por ejemplo:

 { // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "name":"JS TEST", "type": "pwa-chrome", "request": "launch", "url": "http://localhost:5500/index.html", "webRoot": "${workspaceFolder}" } ]

}

Ahora encontrará que launch.json funciona correctamente y que puede depurar su javascript dentro de VS Code .

Me he encontrado con este problema con React.

TL;RD:

• asegúrese de que la URL esté usando http y en el puerto adecuado
• necesita tener su servidor funcionando, hágalo agregando tareas.json (la misma carpeta que launch.json)
• agregue el nombre de la etiqueta dentro de su launch.json a preLaunchTask

ejemplo de launch.json:

 { "version": "0.2.0", "configurations": [ { "type": "pwa-chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:3000/", "webRoot": "${workspaceFolder}", "preLaunchTask": "react" //remember to add this } ] }

ejemplo de tareas.json:

 { "version": "2.0.0", "tasks": [{ "label": "react", "options": { "cwd": "${workspaceFolder}/YOUR-PROJECT-PATH-HERE-IF-NEEDED" }, "script": "start", "type": "npm" }] }

Explicación:
El depurador no npm run start , debe agregarlo a través de tasks.json, que se encuentra dentro de la misma carpeta donde se encuentra launch.json. Dependiendo de cómo esté organizado su proyecto, deberá modificar la ruta en tasks.json: "cwd": "${workspaceFolder}/YOUR-PROJECT-PATH-HERE-IF-NEEDED" .

También puede iniciar su proyecto a través de un shell como este, en lugar de usar npm directamente:

 { "version": "2.0.0", "tasks": [{ "label": "react", "command": "npm run start", "options": { "cwd": "${workspaceFolder}/YOUR-PROJECT-PATH-HERE-IF-NEEDED" }, "type": "shell" }] }

Este es complicado. El hecho de que haya (a partir de esta fecha del 21 de enero de 2022) 275k vistas, 55 votos a favor, 41 respuestas (en su mayoría con cero votos a favor) de personas que encontraron una solución muy específica y ninguna respuesta realmente aceptada indica que probablemente se trate de un error engañoso . mensaje , que se activa cuando sucede algo malo e inesperado. Conmigo ese resultó ser el caso.

Aparentemente, este error no tiene nada que ver con Chrome ni con ninguna funcionalidad obsoleta. Parece ocurrir cada vez que no se puede establecer la conectividad.

Obtuve esto mientras seguía el tutorial de React para VS Code. En ese tutorial, comienza creando una plantilla con npx y luego ejecutándola con npm start . Eso funcionó y pude ver que estaba usando http://localhost:3000 para la URL en el navegador.

Sin embargo, cuando cambié el código como lo solicitó el tutorial y establecí un punto de interrupción para depurar, recibí el error en la publicación del OP, tanto con Chrome como con Edge.

Eventualmente, después de mucha investigación, descubrí que VS Code estaba creando un launch.json predeterminado para depurarlo y completarlo de esta manera:

 { // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. "version": "0.2.0", "configurations": [ { "type": "pwa-chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:8080", "webRoot": "${workspaceFolder}" } ] }

Y necesitaba cambiar manualmente el 8080 a 3000, lo que solucionó el problema.

La clave para mí fue configurar el punto de interrupción para capturar la excepción como se describe en el OP (nota: solo puede configurar eso con el ícono Depurar seleccionado en el menú de íconos del extremo izquierdo). Si bien el mensaje de error emitido sigue siendo el engañoso "depreciado", había un mensaje que decía "no se puede acceder al sitio" que puede encontrar si investiga un poco, como se muestra aquí:

Me imagino que prácticamente cualquier problema de configuración que haga que la conexión falle provocará este error. Entonces, problemas con el firewall, falta del programa host, mala configuración (como la mía), etc.

Buena suerte en su viaje para encontrar su propia versión de la respuesta a este problema y espero que esto ayude.

En mi caso fue causado por el origen de uBlock. Deshabilitarlo en el sitio web solucionó rápidamente el error.

No he visto a nadie mencionar esto todavía, así que agrego mi respuesta.

En mi caso, tuve una solución Blazor y comencé a recibir el Crbug/1173575, non-JS module files deprecated message , además de esto, ¡también recibí un error 404 para el archivo Index.html !

La causa fue que, sin darme cuenta, eliminé la referencia del proyecto .Server al proyecto .Client . El proyecto se compiló bien sin la referencia, pero supongo que Asp.netCore hace algún tipo de análisis basado en la reflexión sobre las dependencias para construir dinámicamente el mapa de ruta.

Restaurar la referencia al proyecto .Client en el proyecto .Server solucionó el problema.

Abra el archivo launch.json y cambie el número de puerto en "URL" en "configuraciones" al número de puerto del servidor en vivo.

Intente usar HTTP en lugar de HTTPS de Google Chrome con una ventana de incógnito.

En mi caso el problema fue porque el puerto 4200 lo tomó otra aplicación (Docker). Tan pronto como cambié el puerto a 4201 agregando la siguiente estructura en la sección de serve del archivo angular.json , se resolvió el problema.

 "options": { "port": 4201 }

Mostré un mensaje similar en mi consola de depuración y el problema era que el servidor web local estaba apagado, por lo tanto, no estaba disponible. Encendí el servidor en la máquina virtual y la aplicación comenzó a funcionar de nuevo :-)

Pude ejecutar el mío haciendo clic en "Agregar configuración" e incluyendo el comando que especificamos en nuestro archivo package.json y usamos para ejecutar durante el desarrollo.

Para mí, el problema era que la aplicación react/next.js no se estaba ejecutando. Básicamente, debe mantener la aplicación ejecutándose en una ventana/terminal separada para poder conectar el depurador. Esto es diferente a la otra aplicación donde comienza desde la propia consola de depuración.

Esto puede ser útil para alguien que trabaja en un proyecto que se comunica a través de iframes. Encontré esta advertencia en una aplicación web actual: Crbug/1173575, archivos de módulos que no son JS en desuso.

En mi caso, el motivo fue que el origen del iframe del recurso no se estaba sirviendo, lo que significa que no se podía acceder a la URL de solicitud del iframe. Al servir el recurso desapareció la advertencia.

Mi problema estaba en la configuración de red de mi computadora con Windows 10, no en el navegador. Probé mi URL en otra computadora y navegadores móviles y funcionaba bien.

Entonces, solucioné el problema al restablecer la configuración de mi red

Para hacer eso, vaya a Configuración -> Red e Internet -> Desplácese hacia abajo para restablecer la red

Espere 5 minutos hasta que se reinicie.

Este problema lo enfrento al depurar el código vs para una aplicación Angular. Las causas probables pueden ser que el servidor no esté activo y escuchando el puerto. Puede iniciar el servidor manualmente mediante ng serve --port con el número de puerto. También compare la URL en el lanzamiento .json y compare el número de puerto

En VSCode , cambie su EJECUTAR Y DEPURAR a Flutter & Dart y luego intente ejecutarlo, funcionará

También tuve este problema y ninguna de las soluciones enumeradas fue útil. Sin embargo, el problema era bastante fácil de resolver.

Simplemente vaya a la pestaña Network de Chrome Developer Console. Asegúrese de que la conexión esté en No throttling y no fuera de Offline .

Me encontré con este error en 3 proyectos independientes de Next.js. Mismo error en Chrome, Chrome Incognito, Firefox y Edge. Ocurrió en la compilación de producción ( next build && next start ) y el servidor de desarrollo ( next dev desarrollo). Después de probar una serie de correcciones, asegurándome de que estaba en HTTP y no en HTTPS, verificando si el puerto estaba en uso, eliminando node_modules y ejecutando npm install , etc., lo que finalmente funcionó fue reiniciar mi computadora...

Publicando aquí en caso de que alguien se haya encontrado con este problema al usar Next.js. ¡Espero que esto ayude, y me encantaría saber qué causa el error!

Eliminar estas dos líneas funcionó para mí. Es un error de Https

 var cors = require('cors'); app.use(cors());

Para agregar otro ángulo a esto. Nombré mis módulos de javascript con .mjs después de configurar mi servidor web para servir mjs con application/javascript . Obtuve el error.

'crbug/1173575, archivos de módulos que no son JS obsoletos.'

Ninguna de las respuestas aquí ayudó. Para arreglarlo di una ruta al módulo.

Desde

 <script type="module" src="xxx.mjs"></script>

Para

 <script type="module" src="./xxx.mjs"></script>

Y el error se fue.

En Visual Studio Code, puede usar la configuración "normal" de ejecución y depuración de Dart&Flutter. Si no tiene un emulador abierto, la aplicación se abrirá automáticamente en el navegador Chrome.

 { // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "name": "app", "request": "launch", "type": "dart" }, { "name": "app (profile mode)", "request": "launch", "type": "dart", "flutterMode": "profile" } ] }

Probado en VSCode 1.62.3 con Dart 2.14.4 y Flutter 2.8.0-3.3.pre

Punto de control (si está trabajando con una carpeta/archivo)

1. Compruebe el nombre de la carpeta/archivo
2. Eliminar caracteres especiales (el nombre de la carpeta/archivo no permite caracteres especiales)
3. Depure su código con cuidado (la excepción de captura de Java no puede detectar esos errores)

Creo que deberíamos simplemente eliminar las cookies en esa URL:

He visto muchas soluciones para este problema, pero nada funcionó.

Después de depurar un poco y comentar muchas partes del código, logré localizar el problema.

Básicamente, ocurre en el backend; no la interfaz.

Había un bucle infinito que mantenía las respuestas atascadas. Arreglar ese problema, lo resolvió para mí.

En lugar de iniciar su aplicación usando la opción "Iniciar Chrome contra localhost" , configure el nombre de su aplicación para iniciar - Resuelto.

Vea la imagen adjunta para más contexto.

Cuando intento seguir los pasos descritos en Depuración de Chrome con Angular CLI , recibo un mensaje que indica que la biblioteca ya no es compatible y un enlace a este artículo:

Pasado, presente y futuro de la solicitud #3142

Tuve este mismo error y lo resolví apagando mis complementos. Específicamente un complemento CORS que he estado usando.

En mi caso, se resolvió cerrando el navegador y recompilando la aplicación.

Tuve el mismo problema y el problema estaba en la URL, era https://localhost:8000; en lugar de http://localhost:8000 .

Así que intente verificar su URL y rutas.

Me encontré con el mismo problema en Visual Studio Code cuando intenté depurar un archivo de Python. Lo resolví eliminando el archivo launch.json anterior y creé uno nuevo para este archivo.

Tuve un encuentro similar en un proyecto de JavaScript. Pero no había aprendido JSON, pero simplemente eliminé los últimos tres comandos en el archivo JSON que eliminó los nombres "url" y "webroot".

Mi servidor simplemente no se ejecutaba localmente. :) Iniciar localhost lo resolvió.

Prueba esto:

 { // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "request": "launch", "name": "Launch Chrome against localhost", "type": "dart" } ] }

Tuve el mismo problema con una aplicación que necesitaba ejecutar navigator.geolocation.getCurrentPosition en mi aplicación React que, por supuesto, necesita HTTPS.

 // .env.local HTTPS is set to true HTTPS=true

El problema: estaba cargando la página con HTTP y no con HTTPS .

Captura de pantalla de error

Tuve el error crbug/1173575, non-JS module files deprecated con algunos archivos PDF que se muestran en un iframe.

Fue porque tenían una coma (",") en el nombre del archivo. Después de cambiar el nombre del archivo, todo estaba bien.

Tuve un problema similar. Sin embargo, descubrí una solución diferente. Todavía vale la pena verificar los pasos en el enlace de GitHub de la solución de OP.

El proyecto en el que estaba trabajando se realizó en una versión anterior y la URL de launch.json tenía // delimitadores. Reemplazarlos sin delimitadores resolvió el problema.

desde

 "url":"file:///C://exampleParent//exampleChild//file.txt"

para

 "url":"file:///c:/exampleParent/exampleChild/file.txt"