Nuxt3部署Netlify后Supabase createClient报错：main.createClient is not a function

本地开发时，在Nuxt3的server/api/myroute.ts中实例化Supabase一切正常，但部署到Netlify后，通过Postman访问接口触发500错误，报错信息如下：

{
    "url": "/api/incoming-message",
    "statusCode": 500,
    "statusMessage": "",
    "message": "main.createClient is not a function",
    "stack": ""
}

相关代码片段：

import { Database, Json } from '~/types/supabase';
import twilio from 'twilio';
import { createClient } from '@supabase/supabase-js';

export default defineEventHandler(async (event) => {
    const config = useRuntimeConfig();

    const supabase = createClient<Database>(
        config.public.SUPABASE_URL,
        config.private.SUPABASE_SERVICE_KEY
    );
    // ... 后续业务代码
});

解决方案 #

• 检查Supabase SDK版本兼容性
  该错误多由@supabase/supabase-js版本与Netlify构建环境不兼容导致。尝试将SDK降级至稳定版本（如@supabase/supabase-js@2.38.0），更新依赖后重新部署。

• 核对Netlify环境变量配置
  确保Netlify后台已正确配置对应环境变量：

  • NUXT_PUBLIC_SUPABASE_URL 对应代码中的config.public.SUPABASE_URL
  • NUXT_SUPABASE_SERVICE_KEY 对应代码中的config.private.SUPABASE_SERVICE_KEY
    变量名需严格匹配，注意Nuxt3的环境变量前缀规则：带NUXT_PUBLIC_的会暴露给客户端，仅带NUXT_的仅在服务端可用。

• 调整Supabase导入方式
  部分构建环境对ES模块命名导入的处理存在差异，尝试改用默认导入：

  import Supabase from '@supabase/supabase-js';
  
  const supabase = Supabase.createClient<Database>(
      config.public.SUPABASE_URL,
      config.private.SUPABASE_SERVICE_KEY
  );
  

• 清理Netlify构建缓存
  旧缓存可能导致依赖版本异常。进入Netlify后台的部署页面，选择「Clear cache and deploy site」执行清理缓存后的重新部署。

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