Nuxt Nation カンファレンスが開催されます。11月12日~13日にご参加ください。
デプロイ

Zerops

NuxtアプリケーションをZeropsインフラストラクチャにデプロイします。

Node.js プリセット: SERVER_PRESET: zerops静的プリセット: SERVER_PRESET: zerops-static

Zerops で詳細をご覧ください。
Nuxt x Zerops クイックラン ✨
インストールや設定なしで、ZeropsでのNuxtの実行をテストしたいですか?Zerops x Nuxt - 静的 または Zerops x Nuxt - Node.jsでのSSR リポジトリを使用すると、ワンクリックで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
  • Zeropsアプリで設定 > アクセストークンの管理を開き、新しいアクセストークンを生成します。
  • 次のコマンドを使用して、アクセストークンでログインします。
zcli login <token>
  • アプリのルート(zerops.yml がある場所)に移動し、次のコマンドを実行してデプロイをトリガーします。
zcli push

サービスをGitHub / GitLab リポジトリに接続することで、コミットまたは新しいタグごとにコードを自動的にデプロイできます。この接続は、サービスの詳細で設定できます。

Zeropsドキュメント で詳細をご覧ください。