您正在浏览 Nuxt 2 文档。前往 Nuxt 3 文档, 或了解更多关于 Nuxt 2 长期支持


将 Nuxt 部署到 Hostman

如何将 Nuxt 部署到 Hostman?


Hostman 是面向初创公司和新项目的云托管提供商,可以消除大多数日常 DevOps 操作,为开发者节省时间,为企业节省资金。Hostman 采用服务概念,简化复杂架构的开发,并支持一键扩展。

Hostman 提供以下功能:

  • 构建和部署静态网站、Web 应用程序、Docker 容器和数据库。
  • 可以看到应用程序运行的实际硬件和实际负载,出现问题时可以评估,一切都非常透明。
  • 可以通过 SSH 进入 Docker 容器,提供抽象和透明的完美平衡。
  • Hostman 自动为所有域名配置 SSL 证书,并设置 CDN 以尽可能快速地分发内容。
  • Hostman 自动化 CI/CD,每次将新提交推送到仓库时立即拉取代码、构建并启动。
  • 无供应商锁定。
  • Hostman 支持 22 个框架。

前提条件

本指南假设您已有要部署的 Nuxt 项目。如果需要项目,请使用 create-nuxt-app

设置


步骤 1. 创建服务

要部署 Nuxt 静态网站,请点击控制台 左上角的创建,选择前端应用或静态网站。

Hostman dashboard

步骤 2. 选择要部署的项目

如果您使用 GitHub、GitLab 或 Bitbucket 账户登录 Hostman,此时将显示您的仓库(包括私有仓库)。

选择要部署的项目,该项目应包含运行 yarn create-nuxt-app 命令后自动创建的 Nuxt 应用目录。

要访问其他仓库,请点击 Connect another repository

如果未使用 Git 账户凭据登录,现在可以访问所需账户并选择项目。

步骤 3. 配置构建设置

接下来将显示 Website customization 页面。

Build configuration

从框架列表中选择 Static website 选项。

Directory with app 是指构建后项目文件所在的目录。对于 Nuxt,目录为 dist。

标准的构建命令为:

yarn build

这将启动框架命令 nuxt generate,创建包含项目文件的 dist 目录。

如果项目的构建过程需要,可以在此修改命令,多个命令可以用 '&&' 分隔输入。

步骤 4. 部署

点击 Deploy 启动构建过程。

启动后,部署日志将开始填充。如果代码有问题,日志中会显示警告或错误消息,指出问题所在。

通常日志包含所有必要的调试数据,但如果需要帮助解决问题,也欢迎通过聊天联系我们。

部署完成后,您将收到电子邮件通知,日志中也会显示类似条目:

Log entry

全部完成!

您的项目已启动并准备就绪。

Edit this page on GitHub Updated at Tue, Apr 14, 2026