2026年我用AI工具从零搭了一个海外电商独立站：7天、$47、全流程复盘

---

先说结果：7天，$47（约340块人民币），一个能收美元、支持中英文切换、有完整购物车和支付流程的海外独立站上线了。

全程我一个人。没有设计师，没有前端帮忙，没有后端写接口。80%的代码是AI生成的，20%是我手写的——主要改bug和处理AI搞不定的边缘逻辑。

这篇文章不是工具评测，是我从头到尾的记录。有踩坑，有决策过程，有真实账单。如果你也想用AI搭一个海外站，看完能少走很多弯路。

---

一、技术选型：为什么是这个组合

先说结论式的技术栈：

层面	选型	为什么
前端	Next.js + Tailwind CSS	AI对Next.js的生成质量最高，Tailwind按需加载对SEO友好
后端	Next.js API Routes	不单独起服务，省一台服务器
数据库	Supabase (PostgreSQL)	免费额度够用，自带Auth，实时订阅对库存管理有用
支付	Stripe	海外站唯一解，文档全、SDK好用、AI知道怎么写
托管	Vercel (Hobby)	免费层足够起步，自动部署，SSL自带
域名	Namecheap	便宜，.com $6.98/年
AI主力	Claude Code + Cursor	Claude Code负责后端逻辑，Cursor负责前端页面
图片	AI生成 + Unsplash	产品图AI出，Banner用Unsplash

为什么没选Shopify？

很多人问我这个问题。Shopify月费$39起，加上插件随便就$100+/月。$47是我全部的一次性投入（不含续费），不是一个月的账单。

而且Shopify的AI插件我没找到能做全站深度定制的——它们更偏向模板填空。我想要的是一个我能完全控制的站，不是一个"把商品填进去就完事"的盒子。

为什么没用Windsurf/Bolt这类一站式AI建站工具？

测试了两个，前端画得不错，但一到支付集成和数据库就暴露问题——生成的代码看起来对，跑起来崩。我宁愿用更底层的AI工具，虽然每次要写更多prompt，但至少我知道每行代码在干什么。

---

二、Day by Day 时间线

Day 0（晚上2小时）：选型 + 初始化

先花1小时定了上面的技术栈。然后用 Vercel 模板一键创建 Next.js 项目，Supabase 建好表结构——这一步 AI 帮了大忙，我把需求描述给 Claude Code：

“建一个电商数据库，需要 products、variants、orders、order_items 四张表。products 支持多语言（中文名、英文名、中文描述、英文描述），variants 支持多 SKU，orders 关联 Stripe payment_intent_id。”

Claude Code 直接输出完整的 SQL migration 文件，我只改了一个字段类型（它把价格设成了 integer，我改成了 decimal）。

Day 1（6小时）：前端骨架 + 产品列表

这一天主要做两件事：首页布局和产品列表页。

Cursor 画页面的速度让我震惊。我给了它一个我喜欢的独立站截图，它生成了一个风格相似的 Next.js 页面——导航栏、Hero Banner、产品卡片网格、Footer。全程我做了不到 10 处手动调整。

但有一个坑：AI 生成的第一版产品卡片是纯静态 HTML 式的，没有跟 Supabase 做数据绑定。我让它改了两轮才把数据拉取逻辑写对。这个坑的教训：AI 对"看起来像"和"实际能用"之间的差距没有判断力。

Day 2（5小时）：购物车 + 多语言

这一天是进度最快的一天。购物车逻辑（Redux Toolkit + localStorage 持久化）AI 处理得很好，因为购物车是标准模式，网上有大量范例。

多语言用的是 next-intl。AI 生成路由结构时犯了一个错误——它把中文设成了 /zh 而英文是 /，这导致 SEO 爬虫把英文当成默认语言。我手动改成了英文 /en、中文 /zh，根路径 / 做语言检测+重定向。这个改动实际只花了 15 分钟，但发现这个问题花了我 1 小时——因为我用 Lighthouse 跑了一遍 SEO 评分，发现 hreflang 标签混乱。

所以第一个重要原则：AI 生成的代码必须过 SEO 检查工具。

Day 3（7小时）：支付集成 — 最崩溃的一天

Stripe 集成是整个项目里最折磨人的部分。

AI 生成的 Checkout Session 创建逻辑看起来完美。前端点"支付"→后端创建 session→返回 URL→前端跳转 Stripe 托管页面——这个主干流程 AI 一遍过。

但 Webhook 回调出问题了。

支付的异步流程是这样的：用户在 Stripe 页面付款 → Stripe 发 POST 请求到我的 /api/webhook/stripe → 我验证签名 → 更新订单状态 → 减库存 → 发确认邮件。

AI 生成的 webhook handler，签名验证永远失败。我 debug 了快 2 小时，最后发现：AI 从 Stripe 文档里"学"的签名验证方式用的是旧版 API（stripe.webhooks.constructEvent），但新版的 Stripe SDK v16 改了参数顺序。

这不是 AI 的错——它的训练数据里有新旧两个版本的 Stripe 文档，它随机挑了一个。但这就是真实世界里 AI 的局限性：涉及第三方 API 版本变化的逻辑，AI 可能给你一个"曾经正确"的答案。

最后我自己读了 Stripe 最新的 SDK 源码，花了 15 分钟改对了。

Day 4（4小时）：库存管理 + 订单系统

相对轻松的一天。订单列表页面、订单详情、库存自动扣减——AI 处理得很流畅，因为这些都是标准 CRUD 逻辑。

唯一手写的部分是库存并发控制：用 Supabase 的 Row Level Security + 数据库事务，确保不会出现超卖。我让 AI 写第一版，它用的是应用层锁，我告诉它"高并发下会出问题，改用数据库行锁"，它改对了。

Day 5（5小时）：SEO + 性能优化

这一天的主要工作不是写代码，是检查和修正。

• 用 Lighthouse、PageSpeed Insights、Google Rich Results Test 各跑了一遍
• AI 生成的 sitemap.xml 漏了变体产品页面，手动补上
• JSON-LD 结构化数据 AI 写得太简略，手动丰富了 Product schema（加上价格、库存状态、评分）
• 图片懒加载和 WebP 转换是 Next.js 自带的，不需要额外配置
• 多语言 hreflang 标签在 Day 2 已经修了，复查一遍确认没问题

Day 6（3小时）：隐私政策 + 合规

海外的合规要求比国内严得多。GDPR cookie 弹窗、隐私政策、Terms of Service、退货政策——这些看起来是"文案"，但写错了有法律风险。

我让 AI 生成了一版隐私政策，然后用几个合规检查工具（Termly、CookieYes 的免费扫描）跑了一遍，发现：

• Cookie 声明里漏了 Stripe 的三方 cookie
• 数据留存时间写得太模糊
• 缺少加州 CCPA 的"不出售个人信息"声明

教训：AI 生成的合规文档最多当草稿，必须过合规工具检查。

Day 7（3小时）：收尾 + 上线

最后一天做收尾工作：全站测试（手动走通完整购买流程 3 次）、加 Google Analytics、设置 Stripe 的邮件通知模板、提交 sitemap 到 Google Search Console。

下午 3 点，域名 DNS 解析生效。我用自己信用卡走了一遍完整的下单流程——从点击商品到收到 Stripe 的确认邮件。$1 的测试商品，扣款成功，订单状态正确更新，库存从 999 变成了 998。

---

三、成本拆解

全部费用，精确到美元：

项目	费用	备注
域名 (namecheap)	$6.98	.com 首年优惠价
Vercel 托管	$0	Hobby 方案，月 100GB 带宽够用
Supabase 数据库	$0	免费层 500MB，起步够用
Stripe 支付	$0	无月费，仅交易时收 2.9%+$0.30
Claude Code	$20	一个月订阅，用了 12 天
Cursor	$20	一个月订阅
合计	$46.98

严格来说 Claude 和 Cursor 是按月订阅的，不能算"7天的成本"。但如果已经有这两个工具（很多人都有），增量成本只有域名那 $6.98。

Stripe 的交易手续费 2.9% + $0.30 是每笔交易才产生的，不计入建站成本。如果月销 $5000，手续费大概 $150。

---

四、踩坑 Top 3

🥇 第一名：Stripe Webhook 签名验证 — 耗时 2h+

前面说过了。核心问题是 AI 用了旧版 SDK 的调用方式。这类"API 版本漂移"问题 AI 自己发现不了——它不知道"我给的代码现在还能不能跑"。

经验：凡是涉及第三方 API 的关键逻辑（支付、短信、邮件发送），写完先跑一遍端到端测试，别相信"看起来没问题"。

🥈 第二名：多语言 SEO — 耗时 1h

hreflang 标签错误、sitemap 缺少语言变体、语言检测逻辑导致爬虫抓不到英文页面。这三个问题全部来自 AI 生成的多语言配置。

经验：多语言站上线前必跑 Google Rich Results Test + 用 site:你的域名 在 Google 上看索引情况。

🥉 第三名：AI 生成的图片"太假了" — 耗时 30min

AI 生成的产品图（Midjourney 出的），单独看挺好看。放进产品卡片里，3 张 AI 图放在一起就暴露了——光影不一致、材质感不对、构图风格不统一。

最后还是用了 Unsplash 的免费摄影图做 Banner，产品图暂时用占位图，等真实产品到了自己拍。

经验：AI 图片适合做概念稿和占位，上线产品图要么实拍，要么找设计师统一风格后处理。

---

五、跟传统建站对比

我做了一个大致的对比：

	传统方式（我5年前的经历）	AI辅助（这次）
总耗时	约 120-150 小时	约 35 小时
设计	找设计师 $500-2000	$0 (AI生成+自己调)
前端开发	约 60-80 小时	约 10 小时（主要是review）
后端开发	约 40-50 小时	约 12 小时（主要是debug）
支付集成	约 15-20 小时	约 7 小时（踩坑花了大半）
SEO/合规	约 10-15 小时	约 8 小时
月固定成本	$50-100+	$0-20（工具订阅）

建站这件事，门槛被 AI 打掉了 70% 以上。但剩下的 30%——尤其是支付、合规、性能调优——仍然需要人的判断力。

---

六、适合谁、不适合谁

适合：

• 有开发基础的程序员。你会写代码，知道什么是好的架构，你缺的是海外的产品/SEO/合规知识。AI 能帮你写代码，但方向要你定。
• 想做验证的人。不确定产品有没有人买，花 $47 做一个 MVP 验证市场比花 $5000 找外包靠谱得多。
• 想出海但预算有限的小团队。$47 起步跑通模式，验证了再投钱。

不适合：

• 零编程基础的人。虽然 AI 写了 80% 的代码，但那 20% 需要你会读代码、会debug、会判断。目前纯"拖拽建站"的工具更适合零基础（但要接受模板限制）。
• 需要复杂电商功能的人。多仓库存、会员体系、优惠券引擎、推荐算法——这些我还是建议用 Shopify 或 Magento。AI 能生成一个"看起来像"的版本，但生产环境会崩。
• 对速度要求极致的人。如果你的核心卖点是加载速度（比如面向网速慢的地区），建议手写关键渲染路径。AI 生成的组件会有一些不必要的重新渲染。

---

七、结尾：Stripe 的通知邮件

第七天下午 3:17，我在 Gmail 里看到了一封新邮件。

发件人：Stripe。主题：「You received a payment of $1.00」

点开一看：

Payment from *** **** (********)
Amount: $1.00 USD
Description: Test Product
Status: Succeeded

这个页面我看过无数次——作为用户，在别人网站买东西时收到的 Stripe 收据。但这是第一次，我自己的 Stripe 账号收到了付款通知。

$1，测试订单。但流程通了。

一个域名、一台"服务器"（Vercel 的 Serverless）、一个数据库、一套支付系统。全部加起来 $47，一个人，七天。不是 2018 年那种"找了个外包团队做了三个月花了五万块"的版本。

我知道肯定有人会说：“这算什么，不就是 AI 写的吗？”

是的，80% 的代码是 AI 写的。

但选型的是我，debug 的是我，凌晨一点对着 Stripe 文档一行行看源码的是我，决定什么时候信任 AI 什么时候自己上的——也是我。

这才是 2026 年程序员该有的样子。