使用alanagoyal主题搭建博客时Next.js重写规则报错求助

从报错信息里的undefined/messages可以看出，你的Supabase URL环境变量没有被正确读取，导致重写规则的目标路径拼接成了无效的undefined开头格式，违反了Next.js的重写规则要求。以下是具体排查和解决步骤：

• 检查环境变量命名与读取逻辑
  确认你在.env.local（Next.js开发环境优先读取该文件）里的Supabase URL变量名（通常为NEXT_PUBLIC_SUPABASE_URL），和next.config.js里的读取代码完全一致。正确的重写规则配置示例：

  const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL;
  
  /** @type {import('next').NextConfig} */
  const nextConfig = {
    async rewrites() {
      return [
        {
          source: '/messages',
          destination: `${supabaseUrl}/messages`
        },
        {
          source: '/messages/:path*',
          destination: `${supabaseUrl}/messages/:path*`
        }
      ];
    }
  };
  
  module.exports = nextConfig;
  

  注意：如果需要在客户端也访问该变量，必须给变量名加上NEXT_PUBLIC_前缀。

• 验证环境变量是否成功加载
  在next.config.js开头添加日志输出，确认变量值：

  console.log('Loaded Supabase URL:', process.env.NEXT_PUBLIC_SUPABASE_URL);
  

  重新执行npm run dev，查看控制台输出。如果仍然显示undefined，检查：

  • 环境变量文件是否放在项目根目录
  • 文件命名是否正确（必须是.env.local，注意开头的英文句点）
  • 变量值是否没有多余的空格、引号或换行

• 遵循Next.js环境变量加载规则
  Next.js仅自动加载根目录下的.env.local、.env.development、.env.production文件，若你使用自定义名称的.env文件，需手动通过工具加载，或重命名为标准文件名。

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