[docker] vite 배포하면서 겪었던 시행착오

docker 란?

도커는 컨테이너 기반 가상화 플랫폼으로 응용 프로그램과 그 종속성을 격리된 환경인 컨테이너로 패키징하여 실행하는 기술입니다.

도커 컨테이너는 가볍고 빠르며 확장성이 좋아서 개발 및 배포 프로세스를 간소화하는 데 사용된다고 합니다.

따라서..

docker를 사용해서 ec2에 배포하는 것이 목표인데요

ec2에 배포하기 전 연습을 위해 로컬에 docker를 사용해서 service 프로젝트 배포했어요

 

현재 모노레포 디렉토리는 위와 같은 구조로 되어 있습니다.

현재 service 는 vite를 사용해서 빌드하고 있고 yarn berry를 사용해 개발하고 있습니다.

지금부터 만났던 에러들과 배포하는데 힘들었던 내용을 정리하고자 합니다.

본 글은 로컬 배포일때의 겪었던 문제들을 적은 것임을 알립니다.

 

🔥 첫번째 문제 : vite Config

보통 문제는 vite의 빌드 문제였습니다. 

첫번째로 해주어야 할 것은 vite.config.ts를 수정해주어야 합니다.

export default defineConfig({
  plugins: [react(), vitePluginSvgr(), tsconfigPaths()],
  base: "/",
  server: {
    host: true,
    port: 3001,
  },
  test: {
    globals: true,
    environment: "jsdom",
    setupFiles: "/setupVitest.ts",
  },
} as VitestConfigExport);

 중요한 것은 server 부분입니다. 

vite는 서버가 수신할 IP 주소가 고정되어 있기 때문에 LAN과 공용 주소를 포함한 모든 주소를 수신하려면 이 값을 0.0.0.0 이나 true로 설정하여야 합니다. 

만약 이 설정을 하지 않는다면 배포가 제대로 된 상태에도 서버 접속이 어려울수 있어요.

만약 배포 후 ERR_CONNECTION_RESET 이 뜬다면 이 설정을 안해놓았을 확률이 높습니다.

 

🔥 두번째 문제 : Zero install을 사용하고 있다면

만약 Zero install 을 사용하고 있다면 한번은 DockerFile에서 yarn install 이 필요합니다. 바로 .yarn/unplugged 에 있는 모듈 때문입니다.

yarn berry는 의존성 패키지들을 모두 zip으로 처리합니다. 그렇기 때문에 읽기 밖에 가능하지 않습니다. 하지만 의존성 패키지가 쓰여지거나 실행이 되어야 한다면 zip 파일은 압축 해제되어 .yarn/unplugged 디렉토리에 저장됩니다.

이 파일들은 압축 파일이 아닌 기존의 node_modules 와 비슷한 형태로 되어 있다고 합니다. 각 플랫폼에 맞는 바이너리를 로드해야 하기 때문에 최초 한번은 DockerFile 내에서 yarn install 이 필요합니다. 

 

 

 

🔥 세번째 문제 : platfrom :linux arn64를 사용할때 @esbuild/linux-x64@npm Initiated Worker with invalid execArgv flags: --no-opt

 

이번 배포를 하면서 가장 골머리를 앓았던 에러메시지입니다. 맥북에서 작업한 도커 이미지는 linux 환경에서는 정상적으로 동작하지 않습니다. 따라서 platform linux/amd64 를 통해서 linux환경이라고 명시해주어야 동작을 원활히 합니다.

이 에러는 바로 linux/arm64을 사용했을때 나왔던 에러입니다. 원인은 바로 esbuild의 특징 때문인데요. 

네이티브 코드로 작성되어 플랫폼 별로 바이너리 실행 파일을 설치해야하는 esbuild 특성 상 하나의 os에서 esbuild를 설치한 후 다시 설치하지 않고 디렉토리를 다른 os에 복사했을때 해당 다른 Os 에서 esbuild를 실행할 수 없기 때문입니다. 

이 문제는 특히 window 나 맥북에 esbuild를 설치하고 해당 디렉토리를 linux를 실행하는 docker에서 많이 발생한다고 합니다.

이 문제의 경우 yarnrc.yml을 사용하여 어떤 플랫폼에서 사용할 것인지 작성해주면 해결이 됩니다.

// .yarnrc.yml

supportedArchitectures:
    os:
        - 'darwin'
        - 'linux'
        - 'win32'
    cpu:
        - 'arm'
        - 'arm64'
        - 'x64'

 

 

🔥 네번째 문제: @rollup/rollup-linux-x64-musl Initiated Worker with invalid execArgv flags: --no-opt

 

 

이 에러는 vite 의 빌드 문제와 연관이 있습니다. github 에도 docker 컨테이너에서 rollup 을 찾을 수 없다는 이슈가 올라와 있습니다.

Error: Cannot find module @rollup/rollup-linux-x64-gnu on Docker container · vitejs vite · Discussion #15532

 

이번 에러는 package.json에 yarn resolutions 옵션을 이용하면 해결이 가능합니다.

./packages.json
    "resolutions": {
        ...
        "rollup": "npm:@rollup/wasm-node@*"
    }
}

yarn resolutions 는 의존하는 모듈을 특정 버전으로 고정시키고 싶을때 사용합니다.

yarn resolutions 가 필요할 수 있는 경우는 몇가지가 있습니다.

1. 부정적인 영향을 끼칠 수 있는 문제 있는 업데이트가 있어 이전 버전으로 고정하고 싶은 경우

2. 하위 의존성 B에 업데이트가 있었는데 B에 의존하는 A가 이를 커버하지 않는 경우, A가 이 업데이트를 커버할 때까지 기다릴 수 없으므로 B의 버전을 이전 버전으로 고정하는 경우

3. 하위 의존성 B에 업데이트가 있었는데 굳이 반영할 필요성을 못 느끼는 경우

등이 있습니다.

 

🔥 다른 문제들도 있었으나..

간혹 가다가 이런 에러들 말고 다양한 에러들도 발생했는데 vite 업데이트와 각종 필요한 라이브러리 설치와 함께 해결했던 것 같습니다

 

 

이번 글은 로컬에서 docker 배포를 해보고 싶은 분들을 위해 로컬 배포를 진행하면서 겪었던 에러들을 적어본 글이었어요. 

ec2에 배포를 할때는 platform 을 지정을 안해줘도 원활하게 배포가 가능해서 이런 에러들을 마주치지 않을 것이라고 생각이 됩니다.

다음에는 드디어 docker + ngnix + ec2 와 함께 github action을 사용해서 CI/CD 를 구현해보도록 하겠습니다. 

 

package.json의 resolutions

Nest.js에 Yarn Berry + Zero Install 적용하기