uniapp 如何将应用发行到web平台

“我在使用uniapp开发应用，现在需要将应用发布到Web平台，但不太清楚具体的操作流程。请问应该如何配置和打包？是否需要特别注意H5端的适配问题？能否提供详细的步骤说明或官方文档参考？”

2 回复

在 HBuilderX 中选择「发行」→「网站-PC Web 或手机 H5」，配置基础路径后打包即可生成 Web 应用。


在 UniApp 中，将应用发行到 Web 平台（H5）非常简单，只需通过 HBuilderX 工具进行配置和打包。以下是详细步骤：

  1. 配置 manifest.json 文件：

    • 打开项目根目录下的 manifest.json 文件。
    • 在 “H5 配置” 部分设置标题、模板路径等参数（可选）。
    • 确保路由模式为 hash（默认），以兼容 Web 服务器。

  2. 运行或发行 H5：

    • 在 HBuilderX 顶部菜单，选择 运行 -> 运行到浏览器 -> Chrome（或其他浏览器）进行本地测试。
    • 确认功能正常后，选择 发行 -> 网站-H5 手机版。
    • HBuilderX 会自动编译并生成 unpackage/dist/build/h5 目录，其中包含所有 Web 静态文件。

  3. 部署到服务器：

    • 将 h5 目录下的所有文件上传到你的 Web 服务器（如 Nginx、Apache）。
    • 确保服务器支持 History 路由模式（如需要，可配置重定向规则）。

注意事项：

  • 如果使用 Vue Router 的 History 模式，需在服务器端配置将所有路由指向 index.html。
  • 测试时注意跨域问题，可通过代理或后端配置解决。

完成以上步骤后，你的 UniApp 即可在 Web 平台访问。无需额外代码，整个过程基于工具配置。

回到顶部