通过 100+ 技巧集合学习 Nuxt!
部署

Zerops

将你的 Nuxt 应用程序部署到 Zerops 基础设施。

Nodejs 预设: SERVER_PRESET: zerops静态预设: SERVER_PRESET: zerops-static

Zerops 中阅读更多。
Nuxt x Zerops 快速运行 ✨
想要在 Zerops 上测试运行 Nuxt 而无需安装或设置任何东西吗?使用代码仓库 Zerops x Nuxt - StaticZerops x Nuxt - SSR on Node.js,你可以通过单击部署 Nuxt 示例应用。

Zerops 支持通过项目根目录中的一个简单配置文件来部署静态和服务器端渲染的应用。

静态

项目和服务可以通过“项目添加向导”添加,也可以使用 YAML 结构导入

创建项目

zerops-project-import.yml
project:
  name: recipe-nuxt

services:
  - hostname: app
    type: static

这将创建一个名为 recipe-nuxt 的项目,其中包含一个名为 app 的 Zerops 静态服务。

设置 Zerops YAML

要告诉 Zerops 如何构建和运行你的应用,请在你的根目录中添加一个 zerops.yml

zerops.yml
zerops:
  - setup: app
    build:
      base: nodejs@20
      buildCommands:
        - yarn
        - yarn nuxi generate
      deployFiles:
        - .output/public/~
    run:
      base: static

现在你可以使用 Zerops CLI 触发构建和部署管道,或者通过在服务详情中将应用服务连接到你的 GitHub / GitLab 代码仓库。

SSR Node.js

项目和服务可以通过“项目添加向导”添加,也可以使用 YAML 结构导入

zerops-project-import.yml
project:
  name: recipe-nuxt

services:
  - hostname: app
    type: nodejs@20

这将创建一个名为 recipe-nuxt 的项目,其中包含一个名为 app 的 Zerops Node.js 服务。

设置 Zerops YAML

要告诉 Zerops 如何构建和运行你的应用,请在你的根目录中添加一个 zerops.yml

zerops.yml
zerops:
  - setup: nuxt
    build:
      base: nodejs@20
      buildCommands:
        - yarn
        - yarn build
      deployFiles:
        - .output/~
    run:
      base: nodejs@20
      ports:
        - port: 3000
          httpSupport: true
      start: node server/index.mjs

现在你可以使用 Zerops CLI 触发构建和部署管道,或者通过在服务详情中将应用服务连接到你的 GitHub / GitLab 代码仓库。

构建和部署你的应用

npm i -g @zerops/zcli
zcli login <token>
  • 导航到你的应用根目录(zerops.yml 所在的位置),并运行以下命令来触发部署
zcli push

通过将服务连接到你的 GitHub / GitLab 代码仓库,你的代码可以在每次提交或新标签时自动部署。此连接可以在服务详情中设置。

Zerops 文档中阅读更多。