Problemas al Ejecutar Comandos de Build, Linting y lint-staged

Descripción

Al intentar ejecutar los comandos para build el proyecto, formatear el código y ejecutar ESLint, nos encontramos con varios errores que impiden la correcta ejecución de estas tareas esenciales. Los errores parecen estar relacionados con la configuración de ESLint, el uso de módulos ES en Node.js, y conflictos con plugins de ESLint para Next.js.

Errores encontrados

Error al ejecutar npm run build:

⚠ The Next.js plugin was not detected in your ESLint configuration. See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
 ⨯ ESLint: Plugin "@next/next" was conflicted between ".eslintrc#overrides[0] » eslint-config-next/core-web-vitals » plugin:@next/next/core-web-vitals" and ".eslintrc#overrides[0] » plugin:@next/next/recommended".

Error al ejecutar npm run prettier:

Checking formatting...
[error] require() of ES Module /home/zyruks/github/2024/node_modules/prettier-plugin-tailwindcss/dist/index.mjs not supported.
[error] Instead change the require of /home/zyruks/github/2024/node_modules/prettier-plugin-tailwindcss/dist/index.mjs to a dynamic import() which is available in all CommonJS modules.

Error al ejecutar npm run lint:


> 2024@0.1.0 lint
> eslint ./src --cache

Oops! Something went wrong! :(

ESLint: 8.57.0

ESLint couldn't determine the plugin "@next/next" uniquely.

- /home/zyruks/github/2024/node_modules/eslint-config-next/node_modules/@next/eslint-plugin-next/dist/index.js (loaded in ".eslintrc#overrides[0] » eslint-config-next/core-web-vitals » plugin:@next/next/core-web-vitals")
- /home/zyruks/github/2024/node_modules/@next/eslint-plugin-next/dist/index.js (loaded in ".eslintrc#overrides[0] » plugin:@next/next/recommended")

Please remove the "plugins" setting from either config or remove either plugin installation.

If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team.

Lint-staged no funciona correctamente en subdirectorios de src

Configuración actual de lint-staged:

 "lint-staged": {
    "src/*.{js,jsx,ts,tsx}": "eslint --cache --fix",
    "src/*.{js,jsx,ts,tsx,css,md}": "prettier --write"
  }

Problema identificado: La configuración actual no incluye una expresión glob que abarque los archivos en subdirectorios, lo cual es necesario para que lint-staged aplique las reglas de ESLint y Prettier a todos los archivos relevantes dentro de src, independientemente de su ubicación.

Pasos para Reproducir

Ejecutar npm install para instalar las dependencias. Ejecutar los comandos npm run build, npm run prettier, y npm run lint para observar los errores mencionados.

JSConfCL / 2024