Next.js+Supabase在Vercel构建时触发无效URL错误求助

1. 检查Vercel环境变量配置 #

• 进入Vercel项目的「Settings → Environment Variables」，确认NEXT_PUBLIC_SUPABASE_URL这类变量的值没有多余双引号。本地.env文件里的引号是Node自动解析的，但Vercel会直接读取原始值，手动加的引号会被当成URL的一部分，导致拼接出"xxx.supabase.co"/auth/v1这种无效格式。直接填纯净的URL即可，比如https://xdqvbnclquqydqsfmfff.supabase.co。

2. 检查Supabase客户端初始化代码 #

• 打开初始化Supabase的文件（比如lib/supabase.ts），确认没有手动给URL套引号的逻辑。比如避免这种错误写法：

  const supabaseUrl = `"${process.env.NEXT_PUBLIC_SUPABASE_URL}"`;
  

  改成直接读取环境变量：

  const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL!;
  

3. 验证Vercel环境变量的实际值 #

• 在Vercel构建脚本里加一行输出命令，比如echo $NEXT_PUBLIC_SUPABASE_URL，查看构建日志里的输出是否带引号。如果有，直接在Vercel后台删除变量值的引号。

4. 重新同步Supabase集成的环境变量 #

• 进入Vercel的Supabase集成页面，重新同步一次环境变量，确保自动同步过来的URL是纯净格式，没有额外引号。

5. 本地模拟构建测试 #

• 本地执行npm run build，如果也出现相同错误，说明问题在本地.env文件。把.env里的变量值引号去掉（比如NEXT_PUBLIC_SUPABASE_URL="xxx"改成NEXT_PUBLIC_SUPABASE_URL=xxx），再重新构建验证。

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