# 发布多文件静态站点

> 项目里不只有一个 HTML？把构建产物或完整静态文件一起上传，保留页面、图片、CSS 和 JavaScript 的目录结构。

## ZIP 网页、Vue 或 React 项目怎么发布到网上？

将完整静态文件或前端构建产物打包为 ZIP，在 html2.link 上传、检查入口与积分费用，发布后获得访问链接。

Vue、React、Vite 工程需要先构建，再上传 dist 等产物目录。需要服务端渲染、后端进程或数据库连接的应用，不能只靠上传静态文件运行。

## 什么时候使用站点发布

多个 HTML 页面、独立 CSS/JS、图片和字体等资源，都适合一起作为静态站点发布。支持上传 ZIP，也可以直接选择文件夹，由浏览器打包后预检。登录后即可使用，不要求先开通付费会员。

单个独立 HTML 可以使用 [创建页面](https://html2.link/new)。站点托管不运行 Node、PHP、Python 或数据库；需要自建后端的项目，还要另外部署后端并配置可访问的接口。

## 准备正确的文件

普通静态站点保留原目录；前端工程先按项目要求运行构建，例如 ` pnpm build `，然后上传产物目录（常见为 dist）。不要上传整个源码仓库、node_modules、环境文件或密钥。

```
site.zip
├── index.html
├── about.html
└── assets/
    ├── app.js
    ├── app.css
    └── logo.png
```

推荐根目录有 ` index.html ` 或 ` index.htm `。只有一个 HTML 文件时也可以自动识别为入口；只有一个顶层文件夹时会自动剥离该目录。多个 HTML 却没有默认入口时，先整理入口，或按 Agent 文档明确指定入口路径。

常见支持格式包括 HTML、CSS、JS/MJS、JSON、图片、字体、Markdown、文本，以及 MP4、WebM、MP3、WAV 等音视频。不同功能的允许格式并不相同，完整结果以上传预检为准。不支持 PHP 等服务端脚本或可执行程序。

## 体积、文件数和费用

线上 ZIP 和解压后的总大小上限均为 200MB，最多 2000 个文件。计费同时看大小与文件数，取能同时满足两项条件的档位。

| 档位 | 总大小不超过 | 文件数不超过 | 积分/天 |
| --- | --- | --- | --- |
| S | 2MB | 20 | 2 |
| M | 10MB | 100 | 4 |
| L | 50MB | 500 | 10 |
| XL | 100MB | 1000 | 20 |
| XXL | 200MB | 2000 | 40 |

例如 5MB、60 个文件，符合 M 档；很小的站点如果文件数更多，也可能进入更高档。上传后系统会显示预检结果和预计费用，再确认发布。续期方式见 [积分与续期](https://html2.link/guide/credits-and-renewal)。

## 上传、发布和更新

1. 打开 [发布站点](https://html2.link/sites/new)，上传 ZIP 或选择静态产物文件夹。
2. 检查入口、文件数、大小、预估档位和费用。
3. 填写标题、选择续期方式；按需设置访问保护、角标及套餐支持的自定义子域名。
4. 提交后按状态提示等待上传、发布或审核，完成后复制正式访问链接。

后续从原站点进入编辑，重新上传完整的新产物，更新原作品。不要把重新上传当成只追加几个文件；重要内容先备份。体积或档位变化时，核对更新确认中的费用处理。

也可以让 AI 工具按 [Agent 发布指南](https://html2.link/guide/agent-publish) 上传并原址更新。

## 首页能看，子页面或刷新为什么失败

先检查 HTML 链接与资源路径是否对应实际文件，文件名大小写是否一致。不要假设前端 history 路由的任意子路径都会自动回到入口页；可让 AI 改用 hash 路由，或让每个访问路径都有对应静态文件。

单独上传源码中的 index.html，可能仍然引用未构建的入口或缺失资源。应上传构建后的完整产物，包含 assets 等文件夹。

## 保存和上传功能还要单独接入

静态站点上线，不代表已经有数据库或管理后台。需要公开共享数据、图片视频上传或只有发布者能维护的内容，分别参考 [云端数据](https://html2.link/guide/cloud-data)、[媒体上传](https://html2.link/guide/media-upload) 和 [发布者内容管理](https://html2.link/guide/owner-content)。

最后通过正式链接逐页检查，并测试真正的保存、读取和上传操作，不能只检查首页截图。