SvelteKit を Docker 化する方法

このガイドでは、SvelteKit アプリケーションをコンテナ化して展開と管理を簡素化する方法を説明します。 覚えておいてください: これは Svelte ではなく SvelteKit 用です!

セットアップ

SvelteKit プロジェクトがない場合は、プロジェクトを作成します:

<code class="language-bash">npx sv create my-svelte-app --template demo --types ts</code>

次に、コンテナ化に不可欠な Node.js 互換性のために adapter-node を使用するように SvelteKit を構成します。インストールします:

<code class="language-bash">npm i -D @sveltejs/adapter-node</code>

svelte.config.jsを変更します:

<code class="language-javascript">// svelte.config.js
- import adapter from '@sveltejs/adapter-auto';
+ import adapter from '@sveltejs/adapter-node';</code>

次に、Dockerfile を作成します。これは、アプリケーションの構築と実行について Docker に指示します。

<code class="language-dockerfile"># Builder stage
FROM node:22-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build
RUN npm prune --production

# Final stage
FROM node:22-alpine
WORKDIR /app
COPY --from=builder /app/build build/
COPY --from=builder /app/node_modules node_modules/
COPY package.json .
EXPOSE 3000
ENV NODE_ENV=production
CMD [ "node", "build" ]</code>

この Dockerfile はマルチステージ ビルドを使用します。ビルダー ステージではアプリをコンパイルし、最終ステージではより無駄のないランタイム イメージを作成します。

ビルドプロセスを合理化するには、.dockerignore ファイルを作成します:

<code>Dockerfile
.dockerignore
.git
.gitignore
.gitattributes
README.md
.npmrc
.prettierrc
.eslintrc.cjs
.graphqlrc
.editorconfig
.svelte-kit
.vscode
node_modules
build
package
**/.env</code>

通常、すべての依存関係を devDependencies としてインストールします (npm i -D <package> を使用)。これにより、SvelteKit はそれらをバンドルし、未使用のインポートを削除します。 ただし、ビルド中に __dirname 未定義 などの問題が発生した場合は、パッケージを通常の依存関係としてインストールしてください。 すべての依存関係が devDependencies の場合、Docker の最終段階で node_modules のコピーを省略でき、イメージ サイズをさらに最小化できます。

Docker イメージをビルドします:

<code class="language-bash">docker build -t my-sveltekit-app .</code>

コンテナ化されたアプリを実行します:

<code class="language-bash">docker run -p 3000:3000 my-sveltekit-app</code>

http://localhost:3000 でアプリにアクセスします。

環境変数

SvelteKit は、環境変数を管理する 4 つの方法を提供します: $env/dynamic/private、$env/dynamic/public、$env/static/private、$env/static/public。 導入プラットフォームが異なれば、これらの処理方法も異なることに注意してください。ドキュメントを参照してください。

フォームアクションとサーバー側の機能については、クロスサイト POST エラーを防ぐために ORIGIN 環境変数を正しく設定します。

<code class="language-bash">docker run -p 3000:3000 -e ORIGIN=http://localhost:3000 my-sveltekit-app</code>

http://localhost:3000 を運用ドメインに置き換えます。

生産の最適化

1. ヘルスチェック: /health エンドポイントを追加し、Docker の HEALTHCHECK 命令を使用します:

<code class="language-dockerfile">HEALTHCHECK --interval=30s --timeout=3s \
  CMD wget --no-verbose --tries=1 --spider http://localhost:3000/health || exit 1</code>

2. メモリ制限: Node.js のメモリ制限を設定します:

<code class="language-bash">docker run -p 3000:3000 -e NODE_OPTIONS="--max-old-space-size=512" my-sveltekit-app</code>

3. セキュリティ スキャン: 定期的に脆弱性をスキャンします:

<code class="language-bash">docker scout quickview</code>

結論

これで、SvelteKit アプリケーションがコンテナ化されました。導入については、sliplane.io を検討してください。

以上がSvelteKit を Docker 化する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。