クイックスタート

このガイドでは、ローカルのブラウザーゲームを Vifu で遊べるクラウドゲームとしてデプロイします。

1. アカウントを作成してログインする

vifu.ai で Vifu アカウントを作成します。

CLI をインストールしてからログインします。

curl -fsSL https://vifu.dev/cli | bash
vifu login

vifu.ai と同じメールアドレスとパスワードを使います。

2. プロジェクトを作成、または既存ゲームを選ぶ

スターターを作成する場合:

npm create @vifu/vifu my-game -- --template vanilla --no-interactive
cd my-game

既存のブラウザーゲームを使う場合:

cd path/to/your-game
vifu setup
vifu deploy

setup はプロジェクトを検出し、ゲーム名と検出されたビルド設定を確認します。検出結果が合わない場合だけ上書きします。この手順を省略した場合も、deploy がビルド前に同じ設定フローを開始します。CI では vifu deploy --yes で検出された既定値を使えます。

3. Examples を試す

git clone --recurse-submodules https://github.com/vifu-labs/vifu-examples
cd vifu-examples

最初に見る例:

• 01_getting_started/hello_web: 最小のデプロイ可能な Web ゲーム。
• 02_external_ai_games/aiventure: 既存の Angular + Phaser AI ゲームを Vifu AI とデプロイポリシーに合わせた例。

各 example フォルダーで実行します。

vifu deploy

4. SDK を追加する

npm

バンドラーやビルド手順があるプロジェクトでは npm でインストールします。

npm install @vifu/sdk@alpha

import { createVifuSDK } from "@vifu/sdk";

const vifu = createVifuSDK();
await vifu.ready();

CDN

jsDelivr からブラウザー用 build を読み込めます。デプロイするゲームでは SDK の正確なバージョンを使ってください。

<script src="https://cdn.jsdelivr.net/npm/@vifu/[email protected]/dist/browser/vifu-sdk.js"></script>
<script>
  const vifu = window.vifu;
</script>

5. Vifu AI を呼び出す

const result = await vifu.ai.generateText({
  model: "basic",
  messages: [
    { role: "user", content: "Give the player a short hint." }
  ]
});

showHint(result.content);

basic は低コストのゲーム内テキストや分類に向いています。quality はストーリーや複雑な推論に使います。ゲームはバックエンドのプロバイダー名や API key を持ちません。

Vifu AI は既定で SDK から利用できます。通常の vifu.ai.generateText(...) 呼び出しのために manifest 設定を追加しないでください。

6. デプロイする

vifu deploy

vifu deploy は必要に応じてプロジェクト設定を実行し、プロジェクトを検証し、ビルドし、ビルド出力を検査してからアップロードし、プレイ可能な URL を出力します。

失敗した場合は、エラーに表示されるファイル、行、URL、修正方法を確認してください。よくある原因は、CDN JavaScript import、外部 AI / API への直接呼び出し、ローカル専用プロバイダーがブラウザー bundle に残っていることです。

デプロイのオプションとゲーム管理コマンドは デプロイ セクションを参照してください。

ローカルでの挙動

Vifu の外では、Vifu AI、保存、その他の Vifu 機能が使えない場合があります。通常のブラウザーでも、ローカルの代替処理でゲームが読み込めるようにしてください。