En mi create-react-app@2.1.8
TypeScript/React, los errores del compilador de TS solo se muestran en el panel Problemas para los archivos que tengo abiertos en el editor de VS Code. Como resultado, a veces no detecto errores hasta que realmente ejecuto la aplicación.
¿Cómo puedo hacer que TypeScript verifique automáticamente los errores del compilador en todos los archivos de código tan pronto como abro el espacio de trabajo o cuando guardo los cambios en un archivo?
Intenté agregar "watch": "tsc --watch"
como un script en package.json
y luego hacer npm run-script watch
en un panel de terminal integrado, pero esto tiene dos problemas:
¿Hay una solución mejor?
Por cierto, esta es la misma pregunta que Mostrar problemas/errores de TypeScript en todo el proyecto en webstorm , pero sobre Visual Studio Code en lugar de webstorm.
A partir del 14 de abril de 2020 , existe una función experimental en VS Code disponible de forma general para habilitar la generación de informes de problemas en todo el proyecto. Agregue lo siguiente a su settings.json
:
"typescript.tsserver.experimental.enableProjectDiagnostics": true
Es experimental y puede ser abrumador y decepcionante al mismo tiempo.
Mira este espacio .
A partir de noviembre de 2019, lamentablemente esto no es compatible con VS Code de fábrica. Consulte https://github.com/Microsoft/vscode/issues/13953 .
La mejor solución que pude encontrar es agregar una tarea a tasks.json que ejecutará tsc --watch
y configurarla para que se ejecute cuando se abra el espacio de trabajo o la carpeta.
A continuación se muestra una configuración de muestra para tareas.json. Tenga en cuenta que "www" en el fragmento a continuación se refiere a la carpeta con tsconfig.json
que desea verificar. Reemplácelo con el nombre de su propia carpeta, en relación con la raíz de su espacio de trabajo.
{ "version": "2.0.0", "tasks": [ { "label": "tsc watch", "type": "shell", "command": "./node_modules/.bin/tsc", "isBackground": true, "args": ["--watch", "--noEmit", "--project", "www"], "group": { "kind": "build", "isDefault": true }, "presentation": { "reveal": "never", "echo": false, "focus": false, "panel": "dedicated" }, "problemMatcher": "$tsc-watch", "runOptions": { "runOn": "folderOpen" } } ] }
Tenga en cuenta que las tareas de ejecución automática no parecen estar habilitadas de forma predeterminada. Para optar por las tareas de ejecución automática, siga las instrucciones aquí: https://stackoverflow.com/a/58866185/126352
Esta solución se adaptó de la respuesta de @molinx en el problema de GitHub vinculado anteriormente, y se mejoró gracias al comentario de @kumar303 a continuación.