Surge iOS 使用指南

小飞机加速器下载小飞机加速器下载2026-08-2810

安装 Surge 安装 Surge 工具： npm install -g surge 或者使用 Yarn： yarn global add surge 创建 Surge 项目在终端中,使用以下命令创建一个新的 Surge 项目： surge new my_project 这会在当前目录下创建一个 my_project 文件夹，并初始化项目结构。初始化项目内容根据需要添加文件： touch index.html style.css script.js 或者,如果你使用的是 React 或其他框架，可以使用 Surge 的模板： surge init my_project --template react 这样会自动初始化一个 React 项目。配置 Surge 项目在项目根目录下,创建或编辑 surge.json 文件，配置项目信息： { "name": "my_project", "version": "1..", "surge": { "build": "npm run build", // 或手动构建命令 "from": ".", "to": ".", "acl": "public-read" } } build：指定构建命令（如 npm run build）。 from 和 to：指定构建的来源和目标目录。 acl：指定访问控制列表（默认为 public-read）。部署项目在项目根目录执行以下命令部署： surge deploy 或者,如果已经构建了项目： surge --build 部署成功后,Surge 会提供一个浏览器链接，你可以通过这个链接访问你的应用。使用 Surge 的编辑器 Surge 提供在线编辑器，可以直接在浏览器中修改代码：打开 Surge 项目页面。点击...

安装 Surge

安装 Surge 工具：

npm install -g surge

或者使用 Yarn：

yarn global add surge

创建 Surge 项目

在终端中,使用以下命令创建一个新的 Surge 项目：

surge new my_project

这会在当前目录下创建一个 my_project 文件夹，并初始化项目结构。

初始化项目内容

根据需要添加文件：

touch index.html style.css script.js

或者,如果你使用的是 React 或其他框架，可以使用 Surge 的模板：

surge init my_project --template react

这样会自动初始化一个 React 项目。

配置 Surge 项目

在项目根目录下,创建或编辑 surge.json 文件，配置项目信息：

{
  "name": "my_project",
  "version": "1..",
  "surge": {
    "build": "npm run build", // 或手动构建命令
    "from": ".",
    "to": ".",
    "acl": "public-read"
  }
}

build：指定构建命令（如 npm run build）。
from 和 to：指定构建的来源和目标目录。
acl：指定访问控制列表（默认为 public-read）。

部署项目

在项目根目录执行以下命令部署：

surge deploy

或者,如果已经构建了项目：

surge --build

部署成功后,Surge 会提供一个浏览器链接，你可以通过这个链接访问你的应用。

使用 Surge 的编辑器

Surge 提供在线编辑器，可以直接在浏览器中修改代码：

打开 Surge 项目页面。
点击 Edit 按钮，进入在线编辑器。

使用 Serverless 函数

Surge 支持 Serverless 函数，用于处理 API 请求：

在 surge.json 中添加 Serverless 配置：

{
  "surge": {
    "serverless": {
      "handler": "functionName",
      "route": "/api/your-endpoint"
    }
  }
}

创建 functions 文件夹，添加处理逻辑的 JavaScript 文件。
调用 Serverless 函数，

// functions/handlers/api.js
module.exports = (req, res) => {
  // 处理逻辑
  res.json({ message: 'Hello from Surge' });
};

使用 React 项目

如果使用 React，按照以下步骤：

初始化 React 项目：

npx create-react-app my_project

修改 public/index.html，指向 Surge 域名：

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />My React App</title>
  <script src="https://unpkg.com/react@17/umd/react.development.js"></script>
  <script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
  <link rel="stylesheet" href="https://unpkg.com/bootstrap@5.3./dist/css/bootstrap.min.css" />
</head>
<body>
  <div id="root"></div>
  <script src="%PUBLIC_URL%/build/index.js"></script>
  <script src="https://unpkg.com/react@17/umd/react.development.js"></script>
  <script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
</body>
</html>

修改 package.json，添加 Surge 构建命令：

{
  "scripts": {
    "build": "react-scripts build",
    "surge": "surge build"
  }
}

构建项目并部署：

npm run build && surge deploy

使用自定义域名

在 Surge 项目页面，点击 Settings。
在 Custom Domain 字段中输入你的域名（如 yourdomain.com）。
部署后,Surge 会提供 DNS 配置，更新你的 DNS 解析。

测试与更新

使用 npm run build 构建项目，再部署。
直接在 Surge 编辑器中修改代码，保存后自动重新部署。