Actualmente iniciando el servidor en mi lado del cliente, el error anterior es lo que he estado recibiendo. Estoy usando Typescript, React, ESlint. Parece que no puedo avanzar ya que este error me ha estado persiguiendo. La página de github para Eslint tampoco ha sido de mucha ayuda.
Este error apareció después de haber creado el componente useMutation y exportarlo en index.ts. No estoy seguro de cómo deshacerme de este error.
Below is my package.json { "name": "tinyhouse_client", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", "@types/jest": "^24.0.0", "@types/node": "^12.0.0", "@types/react": "^16.9.35", "@types/react-dom": "^16.9.0", "@typescript-eslint/parser": "^3.0.2", "react": "^16.13.1", "react-dom": "^16.13.1", "react-scripts": "3.4.1", "typescript": "~2.23.0" }, "resolutions": { "@typescript-eslint/eslint-plugin": "^2.23.0", "@typescript-eslint/parser": "^2.23.0", "@typescript-eslint/typescript-estree": "^2.23.0" }, "scripts": { "start": "react-scripts start", " build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, "eslintConfig": { "extends": "react-app" }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, **strong text** "proxy": "http://localhost:9000" } Below is my index.ts export * from './server'; export * from './useQuery'; export * from './useMutation'; And my useMutation.ts import { useState } from 'react'; import { server } from './server'; interface State<TData> { data: TData | null; loading: boolean; error: boolean; } type MutationTuple<TData, TVariables> = [ (variables?: TVariables | undefined) => Promise<void>, State<TData> ]; export const useMutation = <TData = any, TVariables = any>( query: string ): MutationTuple<TData, TVariables> => { const [state, setState] = useState<State<TData>>({ data: null, loading: false, error: false, }) const fetch = async (variables?: TVariables) => { try { setState({ data: null, loading: true, error: false }); const { data, errors } = await server.fetch<TData, TVariables>({ query, variables }); if (errors && errors.length) { throw new Error(errors[0].message); } setState({ data, loading: false, error: false }); } catch (err) { setState({ data: null, loading: false, error: true }); throw console.error(err); } } return [fetch, state]; };Puede arreglar esto en su paquete.json de la siguiente manera:
"@typescript-eslint/eslint-plugin": "^4.18.0", "@typescript-eslint/parser": "^4.18.0",y mi versión mecanografiada es: "mecanografiado": "^4.1.5"
Usuarios de Yarn, tuve el mismo problema en reaccionar, resolví el problema eliminando el archivo package-lock.json e instalando nuevamente:
rm -rf node_modules yarn cache clean yarn installLo hice con vscode cerrado por terminal de linux, para no tener problemas con el caché.
Tuve que agregar las dependencias manualmente, incluso cuando daba una advertencia de incompatibilidad, porque la npm-force-resolutions no me funcionó.
package.json ( dependencies porque estoy usando create-react-app, que nunca he visto usar devDependencies ): "dependencies": { "@typescript-eslint/eslint-plugin": "^4.1.1", "@typescript-eslint/parser": "^4.1.1", } Luego, hago rm -rf node_modules/ para poder tener una instalación limpia de cosas de npm.
A continuación, instale todo: npm install .
Compruebe que tiene la versión correcta: npm ls @typescript-eslint/eslint-plugin . Decía UNMET PEER DEPENDENCY , pero tuve que ignorarlo porque, de lo contrario, no podría hacer que esto funcionara.
npm start a asegurarse de que la aplicación create-react ahora funcione.
Aconsejaría ir primero a la solución npm-force-solutions, pero si falla, pruebe con esta.
Ah, y una nota extra:
Todo este desastre fue porque hice algo como esto:
interface SomeInterface { someBoolean: boolean, someList: number[], someTuple: [string, string] // <-- THIS is the problem }Si eliminé esa línea comentada, el código se compilaría sin problemas. Lo mantuve así porque ya había hecho que mi código funcionara así, pero si simplemente evita tener una tupla dentro de la interfaz (sin importar si tenía etiquetas o no), potencialmente puede evitar toda esta molestia.
En mi caso, tuve que agregar dos dependencias a "resoluciones" en mi paquete.json.
"resolutions": { "@typescript-eslint/parser": "^3.0.0", "@typescript-eslint/eslint-plugin": "^3.0.0" }Y estoy usando Typescript 4.1.0
En caso de que tenga argumentos de función tipeados dinámicamente y Typescript v4 y superior, puede ocurrir este error. tuve
{ ... getDataThunk: (...args: [string]) => dispatch(getData(...args)) ... }Este error nunca se había producido hasta que estaba usando la versión TS <= 4.0.0. Además, tener argumentos extendidos fue un exceso de ingeniería para mí, reemplazándolo con argumentos de función separados por comas exactos resolvió dicho problema.
Encontré este problema y lo resuelvo con cambiar el tipo de valor en el archivo
en mi caso yo estaba declarando un
let data: [] = [];y todo mi archivo es un error Mostrar error de análisis: no se puede leer la propiedad 'mapa' de indefinido cuando cambio a
let data: any = [];Fue trabajo y se resolvió el error.
Además, excepto los problemas array types que describen las respuestas anteriores, hay muchos casos de tuple que causan este problema. Permítanme mencionarlos
interface Some { // error tupleValue: [string, number] // works tupleValue: [v1: string, v2: number] // error tupleArr: [v1: string, v2: number][] // works! tupleArr2: Array<[v1: string, v2: number]> }otro caso:
type ValueView = [value: SomeObj, view: string] // error const res1: ValueView[] = arr.map(v => [v, v.name]) // works !!! const res: ValueView[] = arr.map(v => [v, v.name] as ValueView) // error const res = arr.map(v => [v, v.name] as [SomeObj, string]) // works !!! const res = arr.map(v => [v, v.name] as [value: SomeObj, view: string])Así que revisa tus operaciones de tupla dos veces
para todos los que usan create-react-app y typescript.
cuando encuentras algún error como este
actualizar texto mecanografiado
y
actualizar el paquete de script de reacción
A veces, este error es el resultado de un tipo no válido como han dicho otros
Recibí este error al usar una matriz simple como tipo
const someVariable: [] //Incorrect const someVariable: string[] //CorrectTambién recibí este error al escribir incorrectamente una matriz multidimensional:
const someVariable : [string[]] //Incorrect. Results in map error const someVariable : string[][] //CorrectEl mensaje de error de mecanografiado es bastante críptico, así que espero que esto ayude.
Su versión de TypeScript no es compatible con su eslint. Puede solucionarlo actualizando estas dos dependencias a la última versión.
TypeScript 4.0.5 es compatible con la versión 4.6.0
"devDependencies": { "@typescript-eslint/eslint-plugin": "^4.6.0", "@typescript-eslint/parser": "^4.6.0", }TypeScript 4.1.5 es compatible con la versión 4.18.0
"devDependencies": { "@typescript-eslint/eslint-plugin": "^4.18.0", "@typescript-eslint/parser": "^4.18.0", }TypeScript 4.2.4 es compatible con la versión 4.23.0
"devDependencies": { "@typescript-eslint/eslint-plugin": "^4.23.0", "@typescript-eslint/parser": "^4.23.0", }TypeScript 4.3.2 es compatible con la versión 4.25.0
"devDependencies": { "@typescript-eslint/eslint-plugin": "^4.25.0", "@typescript-eslint/parser": "^4.25.0", }TypeScript 4.5.5 es compatible con la versión 5.10.2
"devDependencies": { "@typescript-eslint/eslint-plugin": "^5.10.2", "@typescript-eslint/parser": "^5.10.2", }TypeScript 4.6.2 es compatible con la versión 5.15.0
"devDependencies": { "@typescript-eslint/eslint-plugin": "^5.15.0", "@typescript-eslint/parser": "^5.15.0", }Para futuros Googlers:
Tuve el mismo problema ahora en TypeScript 4.0.2 en un proyecto Vue.js 2. Lo arreglé actualizando @typescript-eslint/eslint-plugin y @typescript-eslint/parser a lo último que npm me daría usando @latest , que en ese momento era 3.3.0 y 3.10.1, respectivamente.
Intente jugar con tipos de variables dentro de las interfaces. Por ejemplo, tengo este error cuando tenía esa interfaz de estado:
interface State{ foo: [] }pero cuando cambié el tipo de matriz funcionó:
interface State{ foo: string[] }Esto es lo que funcionó para mi proyecto CRA.
Paso 1: edite package.json y establezca la versión typescript en ^3.9.7
Paso 2: elimina la carpeta .cache en node_modules
Paso 3: ejecute la instalación de npm install
Editar: como señaló Meng-Yuan Huang, este problema ya no ocurre en react-scripts@^4.0.1
Este error ocurre porque react-scripts tiene una dependencia directa en el rango 2.xx de @typescript-eslint/parser y @typescript-eslint/eslint-plugin .
Puede solucionar esto agregando un campo de resoluciones a su package.json de la siguiente manera:
"resolutions": { "**/@typescript-eslint/eslint-plugin": "^4.1.1", "**/@typescript-eslint/parser": "^4.1.1" } Usuarios de NPM: agregue el campo de resoluciones anterior a su package.json , pero use npx npm-force-solutions para actualizar las versiones del paquete en package-lock.json .
Usuarios de Yarn: no necesitas hacer nada más. Consulte las resoluciones de dependencia selectivas para obtener más información.
NOTA: si usa espacios de trabajo monorepo/Yarn, el campo de resolutions debe estar en el package.json de nivel superior.json .
NOTA: yarn add y yarn upgrade-interactive no respetan el campo resolutions y pueden generar un archivo yarn.lock con versiones incorrectas como resultado. Cuidado.
Tuve este mismo error, pero la solución para mí fue que tenía uno del tipo como
text : string[] | []y cambiándolo a
text : string[]trabajó para mi
¿Esto viene de eslint-typescript? Si es así, verifique que su versión de mecanografiado no sea una compilación dev/nightly.