部署Hydrogen应用至Vercel时遇ReferenceError: Oxygen is not defined错误求解决

• 替换代码中的Oxygen全局引用

  报错核心是代码直接调用了Oxygen专属对象（如Oxygen.env），但Vercel环境未注入该全局变量。改用Hydrogen通用API替代：

  import {getEnv} from '@shopify/hydrogen';
  
  // 替换原 Oxygen.env.SHOPIFY_STORE_DOMAIN 这类写法
  const storeDomain = getEnv('SHOPIFY_STORE_DOMAIN');
  

• 确认Vercel构建配置
  即使选择了Hydrogen预设，仍需手动核对：

  • 构建命令是否匹配项目包管理器（如npm run build或yarn build）
  • 输出目录是否设置为Hydrogen默认的dist文件夹

• 升级Hydrogen依赖
  旧版本Hydrogen可能强绑定Oxygen环境，升级到最新稳定版消除兼容问题：

  npm install @shopify/hydrogen@latest
  

• 补全Vercel环境变量
  在Vercel项目「Settings → Environment Variables」中，添加Hydrogen运行所需的所有变量（如SHOPIFY_STORE_DOMAIN、SHOPIFY_STOREFRONT_API_TOKEN）——这些变量在Oxygen中会自动注入，但Vercel需手动配置。

• 适配Vercel Edge Runtime
  如果项目用到Hydrogen Worker功能，需调整代码避免使用Oxygen专属Worker API，改用Hydrogen通用请求处理逻辑，适配Vercel的Edge Runtime环境。

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