⚙️ CI Pipeline 구축

[BangDori]

작업 이유

• 자동화 빌드 및 테스트를 활용한 개발 생산성 개선

작업 사항

1️⃣ CI Pipeline 구조도

단계별 흐름은 아래 이미지와 같습니다. npm, yarn과 다른 점이 있다면 pnpm의 경우 pnpm을 추가해주는 Setup pnpm 단계를 거쳐야합니다. 참고로 현재 테스트가 없기 때문에 vitest command의 passWithNoTests 옵션을 추가하여 테스트가 통과하도록 설정하였습니다.

리뷰어가 중점적으로 확인해야 하는 부분

• CI 파이프라인 구조가 잘 작성되었나요?
• 추후 테스트코드가 작성됨에 따라 passWithNoTests은 제거되어야 합니다.

발견한 이슈

1. Vite CJS Node API deprecated

vitest 테스트를 진행하였을 때 위 에러가 발생하였는데 package.json의 type을 module로 설정하여 해결하였습니다.

2. ESLint 9 - Nextjs 호환성 문제

ESLint 9 버전이 출시된 지 얼마 되지 않아 eslint-config-next의 모든 종속성을 지원하지 않아서 v8.57.0으로 다운그레이드 하였습니다. ESLint9로 lint를 실행하였을 때 발생한 에러 로그는 다음과 같습니다.

Invalid Options:
- Unknown options: useEslintrc, extensions, resolvePluginsRelativeTo, rulePaths, ignorePath, reportUnusedDisableDirectives
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.
- 'ignorePath' has been removed.
- 'rulePaths' has been removed. Please define your rules using plugins.
- 'reportUnusedDisableDirectives' has been removed. Please use the 'overrideConfig.linterOptions.reportUnusedDisableDirectives' option instead.
 ELIFECYCLE  Command failed with exit code 1.

3. @typescript-eslint/typescript-estree

ESLint의 버전을 v8.57.0으로 다운그레이드한 후 lint를 실행한 결과 @typescript-eslint/typescript-estree가 typescript v5.6.2를 공식적으로 지원하지 않는다는 경고 메시지가 표시되어 v5.5.4로 다운그레이드 하였습니다. 경고 메시지 로그는 아래와 같습니다.

> [email protected] lint /Users/mac/Desktop/pennyway-client-webview-next
> next lint

=============

WARNING: You are currently running a version of TypeScript which is not officially supported by @typescript-eslint/typescript-estree.

You may find that it works just fine, or you may not.

SUPPORTED TYPESCRIPT VERSIONS: >=4.7.4 <5.6.0

YOUR TYPESCRIPT VERSION: 5.6.2

Please only submit bug reports when using the officially supported version.

=============
✔ No ESLint warnings or errors

참고

• vite-cjs-node-api-deprecated
• New ESLint "flat" configuration file does not work with next/core-web-vitals

[Legitgoons]

몇 가지 궁금한 부분이 있어 리뷰 남겼습니다!

[suhwan2004]

고생하셨습니다! 위에서 질문을 잘 해주셔서 따로 특이사항 없어 approve 해두었습니다!