Next.js 13.5.3中@路径导入模块失败问题求助

你遇到的问题是因为Next.js默认不会自动识别@/作为src目录的路径别名，需要手动配置别名解析规则。

解决步骤： #

• 在项目根目录创建或修改jsconfig.json（JavaScript项目）或tsconfig.json（TypeScript项目）文件
• 在配置文件中添加路径别名映射：

对于JavaScript项目（jsconfig.json）：

{
  "compilerOptions": {
    "baseUrl": "./src",
    "paths": {
      "@/*": ["*"]
    }
  }
}

对于TypeScript项目（tsconfig.json）：

{
  "compilerOptions": {
    // 保留原有其他配置项
    "baseUrl": "./src",
    "paths": {
      "@/*": ["*"]
    }
  },
  "include": ["src/**/*"]
}

• 保存配置后，重启Next.js开发服务器，此时import {connectionSrt} from "@/lib/db";就能正常解析到src/lib/db.js文件了。

原理说明：baseUrl指定了解析模块时的基础目录为src，paths里的@/*映射为src下的所有文件路径，这样@/lib/db就等价于./lib/db（相对于src目录），在pages/api下的文件中就能正确找到目标模块。

内容的提问来源于stack exchange，提问作者Dinesh