Svelte Kit가 로컬 Docker 환경에서 실행될 때까지

개시하다
Ateam Brides Inc. Advent Calendar 2021의 17일째는 주식회사 에이팀 브라이스의 엔지니어, 내일의 마리로크는 너무 기대@mkin가 맡는다
그럼, 많은 사람들이 업무상 Svelt를 사용하려고 하지만 Svelt를 사용할 수 없겠죠?Vercel을 사용하여 쉽게 공개 회사 규정상 바로 사용할 수 없는 경우가 있을 수 있습니다
그렇다면 컨테이너 기술을 사용해 GCP와 AWS에서 쉽게 공개하면 되지 않을까요!?나는 이 보도를 쓰고 싶다.
이 보도에는 속편이 있다.

Svelte Kit에서 시작하는 Kubnetes(GKE)

Google Cloud Run으로 Svelte Kit 이동을 시도합니다(예정: 완료 후 링크 붙이기

개요

최종적으로 클라우드 서비스에 SvelteKit를 공개하고 싶지만 이 기사에서는 1, 2까지 진행된다.실제로docker-compose 운영되기 때문에 개발 환경에서도 사용할 수 있습니다.
작업 환경

macOS Big Sur

1. 프로젝트 만들기
그럼 바로 공식 서류에 따라 프로젝트를 만들겠습니다.
프로젝트 작성

$ npm init svelte@next svelte-gke

# お好きなものを選択してください
> ✔ Which Svelte app template? › SvelteKit demo app
> ✔ Use TypeScript? … No / Yes
> ✔ Add ESLint for code linting? … No / Yes
> ✔ Add Prettier for code formatting? … No / Yes

시작할 때까지 확인

$ cd svelte-gke
$ npm install
$ npm run dev -- --open

부팅 확인Command + C 후 중지.
비de 어댑터 적용
노드 컨테이너에서 Svelte Kit를 이동하기 때문에 공식 문서에 기재된 바와 같이에 노드 어댑터를 설정합니다.

$ npm install @sveltejs/adapter-node@next -D

@next 버전 지정
지정하지 않았을 때, 시작할 때 다음과 같은 오류가 발생합니다
> config.kit.adapter should be an object with an "adapt"method. See https://kit.svelte.dev/docs#adapters
svelte.config.js

-import adapter from '@sveltejs/adapter-auto';
+import adapter from '@sveltejs/adapter-node';

node 어댑터를 통해 부팅하는지 확인

$ npm run dev -- --open

부팅 확인Command + C 후 중지.
2. Docker로 이동
Docker file 만들기
최상위 레벨에서 Dockerfile 및 docker-compose.yml를 생성합니다.

Dockerfile

# ビルド用
FROM node:16.13.1-alpine3.14 as builder

WORKDIR /app

## パッケージをインストール
COPY package.json ./
COPY package-lock.json ./
RUN npm ci

COPY . .

RUN npm run build

# 実行用
FROM node:16.13.1-alpine3.14

WORKDIR /app

## ビルド用のレイヤからコピーする
COPY --from=builder /app/build ./build
COPY --from=builder /app/package.json .
COPY --from=builder /app/node_modules ./node_modules

## Svelteが動く3000ポートを開けておく
EXPOSE 3000

CMD ["node", "./build"]

docker-compose.yml 만들기
docker-compose.yml

version: '3.8'

services:
  frontend:
    image: svelte-app
    build:
      context: .
      dockerfile: ./Dockerfile
    environment:
      NODE_ENV: development
    ports:
      - 3000:3000

부팅 확인

$ docker-compose up --build

부팅 확인Command + C 후 중지.
했어
끝말
Svelte 문서가 영어인 거 알아요?
Svelte와 이런 이벤트에 관심 있으신 분일본어 버전 사이트도 메시지 보내주신 분 계시니 참여해보시는 게 어떨까요?
'Svelte 일본'의 디스코드.의 18일째는
Ateam Brides Inc. Advent Calendar 2021리액트 소재로 발송!!Svelte도 질 수 없잖아!!
참고 자료