es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Eslint + typescript paths aliasing – No se puede resolver la ruta al módulo

17 Jul, 2023 Programación

Agregué la configuración de TypeScript para las rutas:

{
// …..

“moduleResolution”: “node”,
{
“baseUrl”: “app”,
“paths”: {
“@app/“: [““],
“@folder/“: [“folder/“],

// Otras rutas
},
}

Añadí la configuración a webpack:

resolve: {
extensions: [“.tsx”, “.ts”, “.js”, “.jsx”, “.css”, “.json”],
alias: {
“@app”:path.resolve(__dirname + “../”, “app”),
“@services”:path.resolve(__dirname + “../app”, “folder”)
},
modules: [
“node_modules”, path.resolve(process.cwd(), “app”)
],
plugins: [
new TsConfigPathsPlugin({
configFile: “../tsconfig.json”
}),
],
},

Y aquí está mi archivo .eslint:

“settings”: {
“import/resolver”: {
“node”: {
“paths”: [
“app”
],
“extensions”: [
“.ts”,
“.tsx”,
“.jest.tsx”,
“.d.ts”
]
}
}
}

Después de eso, intento importar algo como esto:

import {component} from “@folder/component”;

Todo está ensamblado, el compilador no genera errores
Pero obtengo un error en eslint:

ESLint: No se puede resolver la ruta al módulo ‘@folder/component’.(import/no-unresolved)

He estado tratando de resolver esto durante el tercer día
El cliente no quiere instalar complementos adicionales
¡Le agradecería mucho su ayuda!

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Solución para el error de eslint al usar la configuración de TypeScript para rutas

    Si estás enfrentando un error en eslint al utilizar la configuración de TypeScript para rutas, aquí tienes una posible solución:

    1. Verifica si has agregado correctamente la configuración de TypeScript para rutas. Debería lucir algo así:
    {
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": {
      "@/*": ["*"]
    }
  }
}
    1. Asegúrate de haber agregado correctamente las rutas resueltas en tu configuración de webpack. Debería lucir algo así:
    alias: {
  "@": path.resolve(__dirname, "src"),
},
    1. A continuación, necesitas agregar la siguiente configuración a tu archivo eslint:
    "settings": {
  "import/resolver": {
    "babel-module": {},
    "node": {
      "extensions": [
        ".mjs",
        ".js",
        ".jsx",
        ".ts",
        ".tsx",
        ".json"
      ],
      "moduleDirectory": [
        "node_modules",
        "src"
      ],
      "paths": [
        "@/*"
      ]
    }
  }
}

    Esto debería resolver el error en eslint y deberías poder importar módulos utilizando las rutas configuradas en tu configuración de TypeScript.

    Si aún enfrentas problemas, intenta reiniciar el servidor de desarrollo y borrar la caché. Además, asegúrate de que tus archivos estén guardados y compilados correctamente.

Comments are closed.