I am trying to import files using regular import and with the custom absolute paths in Nextjs using typescript. For some reason I keep getting an error that the module cannot be found but my IDE is able to link the file when I click on it. Also, when its a regular javascript file, instead of typescript, it works fine and files are imported.

For now im using // @ts-ignore and it works, but I wonder if there is a better way to solve this error.

My tsconfig:

    {
  "compilerOptions": {
    "target": "es2015",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": false,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/components/*"],
      "#/*": ["public/assets/images/*"],
    }
  },
  "include": [
    "public/**/*",
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}