내용으로 건너뛰기 문서 내비게이션으로 건너뛰기
GitHub에서 보기

Download(다운로드)

Bootstrap을 다운로드하여 컴파일된 CSS 및 JavaScript, 소스 코드를 얻거나 npm, RubyGems 등과 같은 즐겨쓰는 패키지 관리자를 사용해서 포함시키세요.

Compiled CSS and JS

바로 사용할 수 있는 컴파일된 Bootstrap v5.0.0-beta1 코드를 다운로드해서 프로젝트에 포함시킬 수 있습니다. 다음이 포함되어 있습니다:

여기에는 문서, 소스 파일, 그리고 Popper같ㅇ느 선택적인 JavaScript 의존성이 포함되어 있지 않습니다.

다운로드

Source files

Sass, JavaScript, 그리고 문서 소스를 다운로드해서 고유 자산 파이프라인을 사용해서 BootStrap를 컴파일할 수 있습니다. 이를 위해서는 다음 도구들이 필요합니다:

  • CSS 컴파일을 위한 Sass 컴파일러 (Libsass 또는 Ruby Sass도 지원함).
  • CSS 벤더 접두사를 위한 Autoprefixer

필요한 경우 빌드 도구를 사용할 수도 있습니다. Bootstrap 및 문서 개발을 위해 포함되어 있긴 하지만, 목적에 적합하지 않을 수도 있습니다.

소스 다운로드

Examples

예제를 다운로드하고 확인하고 싶다면 이미 만들어진 예제를 사용해 볼 수도 있습니다:

예제 다운로드

CDN via jsDelivr

jsDelivr를 사용해서 다운로드하지 않고 Bootstrap의 컴파일된 CSS와 JS의 캐시 버전을 프로젝트에 전달하세요.

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>

이미 컴파일된 JavaScript를 사용하고 있고 Popper를 개별적으로 포함시키는 것을 선호한다면 JS 이전에 CDN을 통해서 Popper를 추가하세요.

<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.5.4/dist/umd/popper.min.js" integrity="sha384-q2kxQ16AaE6UbzuKqyBE9/u/KzioAlnx2maXQHiDX9d4/zp8Ok3f+M7DPm+Ib6IU" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.min.js" integrity="sha384-pQQkAEnwaBkjpqZ8RU1fF1AKtTcHJwFl3pblpTlHXybJjHpMYo79HY3hIi4NKxyj" crossorigin="anonymous"></script>

Package managers

Bootstrap의 소스 파일을 유명한 패키지 관리자들을 사용해서 거의 모든 프로젝트에 BootStrap을 사용할 수 있습니다. 패키지 관리자와 상관없이 Bootstrap은 공식 컴파일된 버전과 일치하는 구성을 위해 Sass 컴파일러와 Autoprefixer를 필요로 합니다.

npm

npm 패키지를 사용해서 Node.js로 만들어진 앱에 Bootstrap를 설치하세요:

npm install bootstrap@next

const bootstrap = require('bootstrap') 또는 import bootstrap from 'bootstrap'bootstrap 객체에 모든 Bootstrap의 플러그인을 불러옵니다. bootstrap 모듈은 자체에서 모든 플러그인을 내보냅니다. 패키지 최상위 디렉토리 아래에 있는 /js/dist/*.js 파일을 불러옴으로서 Bootstrap의 플러그인을 직접 독립적으로 불러올 수 있습니다.

Bootstrap의 package.json에는 다음 키에 몇몇 메타데이터가 포함되어 있습니다:

  • sass - Bootstrap의 메인 Sass 소스 파일로 향하는 경로
  • style - Bootstrap의 경량화되지 않았지만 (추가 설정 없이) 기본 설정으로만 사전 컴파일된 CSS로 향하는 경로

yarn

yarn 패키지를 사용해서 Node.js로 만들어진 앱에 Bootstrap를 설치하세요:

yarn add bootstrap@next

RubyGems

Bundler (권장)와 RubyGems by adding the following line to your Gemfile에 다음 줄을 추가해 Bundler (권장)와 RubyGems를 사용해서 Ruby 앱에 Bootstrap을 설치할 수 있습니다:

gem 'bootstrap', '~> 5.0.0.beta1'

Bundler를 사용하고 있지 않다면 다음 명령어를 실행해서 gem을 설치할 수 있습니다:

gem install bootstrap -v 5.0.0.beta1

자세한 사항은 gem의 README를 확인해주세요.

Composer

Composer로도 Bootstrap의 Sass와 JavaScript를 설치 및 관리할 수 있습니다:

composer require twbs/bootstrap:5.0.0-beta1

NuGet

.NET으로 개발하고 있다면, NuGet을 사용해서 Bootstrap의 CSS 또는 Sass 및 JavaScript를 설치 및 관리할 수 있습니다:

Install-Package bootstrap
Install-Package bootstrap.sass