¿Qué es ESLint?
ESLint es una utilidad de JavaScript open-source de linting creada originalmente por Nicholas C. Zakas en Junio de 2013. Es utilizado frecuentemente para detectar patrones problemáticos o código que no cumple ciertas pautas de estilo. ESLint está escrito con Node.js para proporcionar un entorno de tiempo de ejecución rápido y una fácil instalación a través de npm. Con ESLint se puede imponer el estándar de codificación utilizando un determinado conjunto de reglas independientes. Sí, se pueden activar y desactivar esas reglas. Estas reglas son completamente modificables.
¿Por qué usar ESLint?
JavaScript, al ser un lenguaje dinámico y no tipificado, es propenso a errores del desarrollador. ESLint permite poner pautas sobre el estándar de codificación y ayuda a minimizar esos errores. La razón principal para imponer una guía es que cada desarrollador tiene su estilo de escritura (como convenciones de nombres/tabs/comillas simples o dobles para strings). Y, con diferentes técnicas de estilo, su código puede parecer extraño, más propenso a errores y vulnerable. Especialmente cuando se trata de JavaScript, esto podría causar dificultades con las que nunca querría lidiar.
¿Cuándo usarlo?
Puede ser utilizado sin importar el tamaño del proyecto o el equipo. Pero se debería considerar para cualquier proyecto JavaScript/TypeScript de mediana a gran escala y/o si se tiene un gran equipo de desarrolladores con los que lidiar. En cualquier caso, se deben imponer prácticas/pautas de codificación estándar y comunes. Las herramientas de Linting como ESLint permiten a los desarrolladores descubrir problemas con su código JavaScript sin ejecutarlo. Una de las principales razones por las que se creó ESLint fue permitir a los desarrolladores crear sus propias reglas de linting. Puede usar ESLint en cualquier aplicación que se ejecute en JavaScript/TypeScript:
- React/React Native
- Angular
- Node
¿Cómo usarlo?
Así es como puedes instalarlo:
Instalación
Requisitos previos: Node.js (^10.12.0 o >=12.0.0) Puede instalar ESLint usando npm o yarn:
$ npm install eslint --save-dev
# or
$ yarn add eslint --dev
Nota: También es posible instalar ESLint globalmente en lugar de localmente (usando npm install eslint —global). Sin embargo, esto NO se recomienda, y cualquier complemento o configuración compartida que use debe instalarse localmente en cada proyecto.
Inicializarlo
Después de instalarlo, inicialízalo con el siguiente comando:
$ npx eslint --init
# or
$ yarn run eslint --init
Nota: — init asume que ya tiene un archivo package.json. Si no lo hace, asegúrese de ejecutar npm init o yarn init de antemano.
Configurarlo
En el momento en que haya terminado con la instalación y la inicialización, tendrá un archivo .eslintrc.{js,yml,json} en su directorio. En él, verás algunas reglas configuradas así:
{
"rules": {
"semi": ["error", "always"],
"quotes": ["error", "double"]
}
}
Úsalo
Si está aquí, significa que configuró correctamente el ESLint. Así es como puedes usarlo:
$ npx elinst <tu archivo>.js
# or
$ npx eslint <carpeta que contiene archivos js>
También puede agregar lint en el archivo package.json (si aún no lo ha agregado)
"scripts": {
...
"lint": "eslint .",
...
}
¡Felicitaciones!
Logró que su código se vea mucho más limpio y mejor que nunca en sólo unos pocos pasos.