测试 / 学习用途免费部署

# 安装 Git（已安装跳过）
# macOS:  brew install git
# Windows: 下载 https://git-scm.com/download/win
# Linux:   sudo apt install git

# 配置用户信息（只需设置一次）
git config --global user.name "你的名字"
git config --global user.email "你的邮箱"

# 验证
git --version  # git version 2.x.x

# 1. GitHub 上创建名为 "用户名.github.io" 的仓库
#    例如：johndoe.github.io
#    注意：必须公开(Public)，名字必须完全匹配

# 2. 本地初始化并推送
cd 你的网站文件夹
git init
git add .
git commit -m "Initial commit: add website"
git branch -M main
git remote add origin https://github.com/你的用户名/你的用户名.github.io.git
git push -u origin main

# 3. 等待 1-2 分钟，访问 https://你的用户名.github.io
# ✅ 完成！

# 在 GitHub 创建普通仓库，比如 "my-portfolio"
git init
git add .
git commit -m "Add project"
git remote add origin https://github.com/你的用户名/my-portfolio.git
git push -u origin main

# 开启 GitHub Pages：
# 仓库 Settings → Pages → Source → Deploy from branch
# Branch: main, Folder: / (root)
# 保存后访问：https://你的用户名.github.io/my-portfolio/

# 安装 gh-pages 工具
npm install --save-dev gh-pages

# package.json 添加配置
"homepage": "https://你的用户名.github.io/项目名",
"scripts": {
  "predeploy": "npm run build",
  "deploy": "gh-pages -d build"
}

# 部署命令（以后每次更新都运行这一条）
npm run deploy

# GitHub Pages 选择 gh-pages 分支即可

# 修改完文件后，执行以下命令
git add .
git commit -m "Update: 描述你的修改"
git push
# GitHub Pages 会在 1-3 分钟内自动更新

# 安装 Vercel CLI
npm install -g vercel

# 登录
vercel login

# 在项目目录中执行部署
cd 你的项目目录
vercel
# 按提示回答几个问题即可

# 部署到生产环境
vercel --prod

# 查看部署列表
vercel ls

# 方法一：CLI 设置
vercel env add DATABASE_URL
vercel env add API_SECRET_KEY

# 方法二：控制台设置
# 项目 Settings → Environment Variables → Add
# 可以分别设置 Production/Preview/Development 的值

# 在项目根目录创建 netlify.toml

[build]
  command = "npm run build"   # 构建命令
  publish = "dist"             # 构建输出目录

[build.environment]
  NODE_VERSION = "20"

# SPA 路由配置（防止刷新 404）
[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200

# 自定义请求头
[[headers]]
  for = "/*"
  [headers.values]
    X-Frame-Options = "DENY"
    X-XSS-Protection = "1; mode=block"

<!-- 只需添加 data-netlify="true"，无需任何后端代码 -->
<form name="contact" method="POST" data-netlify="true">
  <input type="hidden" name="form-name" value="contact" />
  <input type="text" name="name" placeholder="姓名" />
  <input type="email" name="email" placeholder="邮箱" />
  <textarea name="message"></textarea>
  <button type="submit">发送</button>
</form>
<!-- 收到的表单提交在 Netlify 控制台 Forms 菜单查看 -->

export default {
  async fetch(request, env) {
    const url = new URL(request.url);

    if (url.pathname === '/api/hello') {
      return new Response(
        JSON.stringify({ message: 'Hello from Cloudflare!' }),
        { headers: { 'Content-Type': 'application/json' } }
      );
    }

    return new Response('Not Found', { status: 404 });
  }
};