컨텐츠로 이동

Astro에서 Bun 사용하기

Bun은 올인원 JavaScript 런타임 및 툴킷입니다. 더 많은 내용은 Bun 공식 문서를 참고하세요.

요구사항

  • Bun이 로컬 환경에 설치되어 있어야 합니다. Bun 공식 문서의 설치하기를 참고하세요.

Bun으로 새로운 Astro 프로젝트 생성

다음과 같이 create-astro 명령어를 사용하여 Bun이 포함된 새 Astro 프로젝트를 생성하세요.

Terminal window
bunx create-astro@latest my-astro-project-using-bun

종속성 설치

bunx create-astro 명령어로 프로젝트를 시작하는 경우, CLI는 Bun을 사용해 자동으로 종속성을 설치하므로 이 단계를 건너뛸 수 있습니다.

그렇지 않은 경우 Bun을 사용하여 종속성을 설치해야 합니다.

Terminal window
bun install

타입 추가

Bun은 bun-types 패키지를 제공하며, 이 패키지에는 Bun의 런타임 타입이 포함되어 있습니다.

다음 명령어로 bun-types를 설치합니다.

Terminal window
bun add -d bun-types

설치한 패키지를 tsconfig.json 파일의 types에 추가합니다.

tsconfig.json
"compilerOptions": {
"types": ["bun-types"]
}

Astro 통합 사용

astro add 명령어로 공식 Astro 통합을 추가할 수 있습니다.

Terminal window
bunx astro add react

Bun으로 Astro 실행

개발 서버 실행

Bun을 런타임으로 사용하여 개발 서버를 실행하려면 다음 명령어를 사용합니다.

Terminal window
bunx --bun astro dev

Bun으로 사이트 빌드

Bun을 런타임으로 사용하여 사이트를 빌드하려면 다음 명령어를 사용합니다.

Terminal window
bunx --bun astro build

Astro는 dist/ 디렉터리에 빌드 결과를 생성합니다. 그러면 preview 명령어를 사용하여 사이트를 제공할 수 있습니다.

Terminal window
bunx --bun astro preview

@astrojs/node를 사용하여 Bun으로 SSR 추가

Bun은 Node.js API 호환성을 제공합니다. @astrojs/node (EN) 어댑터를 사용하면, Node 대신 Bun의 런타임으로 서버 측 렌더링 (EN)을 추가할 수 있습니다.

다음 명령어를 사용하여 Astro 프로젝트에 Node.js 어댑터를 추가합니다.

Terminal window
bunx astro add node

위에서 사용한 빌드 명령어를 다시 사용하여 사이트를 다시 빌드합니다.

Terminal window
bunx --bun astro build

마지막으로, 빌드된 사이트를 실행하기 위해 다음 명령어를 사용합니다.

Terminal window
bun ./dist/server/entry.mjs

공식 자료

커뮤니티 자료

Astro와 함께 Bun을 사용하고 계신가요? 이 페이지에 여러분의 블로그 게시물이나 동영상을 추가하세요!