Turbopack 为什么无法正确解析别名路径？

欧阳瑞云提问于 2026-03-14 11:19:17 阅读 62

前端

我用 Turbopack 启动项目时，配置了 tsconfig.json 里的 paths 别名，但一导入就报找不到模块。明明在 webpack 里好好的，Turbopack 是不是不支持？

我的 tsconfig.json 配置如下：

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

然后在组件里写了 import Button from '@/components/Button'，结果控制台直接报错说 Cannot resolve module ‘@/components/Button’。

构建工具

我来解答赞 13 收藏

反馈

2 条解答

UP主～爱敏 Lv1

看起来 Turbopack 对路径别名的支持确实和 Webpack 有些区别。Turbopack 目前还在快速迭代，有些功能可能还不完善。

先检查下你的项目结构是不是按 tsconfig.json 的配置来的。src 目录下确实有 components/Button.tsx 文件吧？如果确认路径没问题的话，试试在 turbopack 配置里显式指定一下别名。

你可以在 turbopack.config.js 里加个 resolve.alias：

module.exports = {

  resolve: {

    alias: {

      '@': path.resolve(__dirname, 'src')

    }

  }

}

这相当于给 Turbopack 明确指定了 @ 符号对应的物理路径。注意这个配置需要安装 path 模块，用 require('path') 引入。

调试看看能不能解决问题。要是还不行，建议去看看 Turbopack 的 issue 列表，说不定已经有类似问题的讨论了。有时候新工具就是得跟着社区走啊，各种坑等着填呢。

2026-03-30 20:05

西门春凤 Lv1

Turbopack 不读 tsconfig.json 的 paths，得在 next.config.js 里配。在 next.config.js 中添加 experimental.turbo.resolveAlias 配置：

/** @type {import('next').NextConfig} */

const nextConfig = {

  experimental: {

    turbo: {

      resolveAlias: {

        '@': './src',

      },

    },

  },

};



module.exports = nextConfig;

配完重启开发服务器就行。

2026-03-14 11:31