Hoy vamos a aprender cómo podemos configurar ESLint para un proyecto que utiliza React y React Native y JavaScript o TypeScript.
Nos permitirá reconocer los errores que aparecen en nuestro código y configurar el tipo de error que queremos.
Lo primero de todo es instalar ESLint:
npm install eslint --global
Una vez instalado, lo instalamos en nuestro proyecto.
npm install --save-dev eslint
Y ahora vamos a configurarlo:
eslint --init
Nos preguntará para qué vamos a utilizar ESLint:
En mi caso seleciono la opción por defecto «To check syntax and find problems».
Ahora selecicono JavaScript modules:
El tipo de framework en este caso es React:
Si no usamos TypeScript seleccionamos No.
En mi caso ejecuto con Node, ya que utilizo React Native, entonces seleccionamos Node
El formato de configuración, podemos elegir el que queramos, en mi caso JavaScript.
Nos preguntará si queremos instalarlo y seleccionamos Yes. Y usando NPM en mi caso.
Una vez instalado, nos habrá creado un archivo llamado .eslintrc.js
Recomiendo instalar el plugin de VSCode ESLint.
Para que ESLint te indique qué importar cuando encuentre un error de importación, puedes usar el plugin eslint-plugin-import. Este plugin proporciona una serie de reglas relacionadas con las importaciones en JavaScript, incluyendo la detección de errores de importación.
npm install eslint-plugin-import --save-dev
Y podemos añadirlo en el archivo .eslintrc.js
"plugins": ["import"],
"rules": {
"import/no-unresolved": "error"
}
Ingeniero en Informática, me encanta crear cosas o arreglarlas y darles una nueva vida. Escritor y poeta. Más de 20 APPs publicadas y un libro en Amazon.