xryuseix Portfolio

Tech Stack

• Next.js 16 (Turbopack / Static Export)
• TypeScript
• HeroUI (formerly NextUI)

Getting Started

yarn install
yarn dev

Live2D セットアップ

トップページのプロフィールアイコンを Live2D モデル (ryusei-chan) に切り替えて表示できます。 Live2D SDK はプロプライエタリなため .gitignore で除外しており、手動セットアップが必要です。

前提

• Cubism SDK for Web をダウンロード済みであること
• ryusei-chan モデルファイルを用意済みであること

手順

1. Framework をコピー

   cp -r /path/to/CubismSdkForWeb/Framework live2d/Framework

2. Core をコピー

   mkdir -p live2d/Core
   cp /path/to/CubismSdkForWeb/Core/live2dcubismcore.js live2d/Core/
   cp /path/to/CubismSdkForWeb/Core/live2dcubismcore.min.js live2d/Core/
   cp /path/to/CubismSdkForWeb/Core/live2dcubismcore.d.ts live2d/Core/
   cp live2d/Core/live2dcubismcore.min.js public/

3. モデルファイルをコピー

   mkdir -p public/Resources
   cp -r /path/to/ryusei-chan public/Resources/ryusei-chan

4. Framework の型チェックを無効化

   Framework の TypeScript ファイルはプロジェクトの strict 設定と合わないため、全ファイルに // @ts-nocheck を付与します。

   python3 -c "
   import glob
   for f in glob.glob('live2d/Framework/src/**/*.ts', recursive=True):
       with open(f, 'r') as fh:
           content = fh.read()
       if not content.startswith('// @ts-nocheck'):
           with open(f, 'w') as fh:
               fh.write('// @ts-nocheck\n' + content)
   "

5. ビルド確認

   yarn build

ディレクトリ構成

live2d/                          # .gitignore 対象
  Framework/                     # Cubism SDK Framework
  Core/                          # Cubism Core ランタイム
  lib/                           # Live2D ラッパー (lappdelegate, lappmodel 等)
  ReactLive2d.tsx                # React コンポーネント
  index.ts                       # バレルエクスポート
public/
  Resources/ryusei-chan/          # .gitignore 対象 - モデルファイル
  live2dcubismcore.min.js         # .gitignore 対象 - ブラウザ用 Core