ダウンロード（Download）

コンパイル済みCSSとJSファイル版（Compiled CSS and JS）v4.5.2時点

Bootstrap v4最新版用のすぐに使えるコンパイル済みコードをダウンロードすれば、自分のプロジェクトに簡単に導入可能。

• コンパイル済み（標準：bootstrap.css、グリッド部分のみ：bootstrap-grid.css、Rebootのみ：bootstrap-reboot.css）、軽量版（標準：bootstrap.min.css、グリッド部分のみ：bootstrap-grid.min.css、Rebootのみ：bootstrap-reboot.min.css）のCSSバンドル（CSSファイルの比較）
• コンパイル済み（標準：bootstrap.js、含Popper.js：bootstrap.bundle.js）、軽量版（標準：bootstrap.min.js、含Popper.js：bootstrap.bundle.min.js）のJavaScriptプラグイン

これには、解説、ソースファイル、任意のJavaScript依存関係ファイル (jQueryとPopper.js) は含まれない。

ダウンロード※ダウンロードファイルの内容はこちら。

 

ソースファイル版（Source files）v4.5.2時点

ソースSass、JavaScript、ドキュメント（解説）ファイルをダウンロードして、プロジェクトのアセットパイプラインでBootstrapをコンパイルする。このオプションを使用するには、次のツールが必要：

• CSSをコンパイルするためのSassコンパイラ（LibsassやRuby Sassがサポート済み）。
• CSSベンダープレフィックス用Autoprefixer

構築ツールが必要な場合、開発向けにBootstrapとドキュメントが組み込まれているが、独自の目的には適さない可能性が高い。

ソースのダウンロード※ダウンロードファイルの内容はこちら。

 

実例（Example）v4.5.0新設

実例をダウンロードして確認したい場合は、すでに構築済みの実例が入手可能。

ソースのダウンロード

※公式サイトの実例なのでダウンロードファイルは英語だが、当サイトの実例にある各ファイルでは日本語のソースコードがコピー可能。

 

BootstrapCDN v4.5.2時点

BootstrapCDNを使用してダウンロードを省略し、Bootstrapのコンパイル済みCSSとJSのキャッシュされたバージョンをプロジェクトに配信。

HTMLコピー<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>

コンパイル済みのJavaScriptを使用している場合は、できればJSの前にCDNを経由してjQueryとPopper.jsを組み入れることを忘れないように。

HTMLコピー<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>

※詳細については、クイックスタートに記載。

※Popper.jsがバンドルされたJSファイル（bootstrap.bundle.min.js）のCDNバージョンについては、BootstrapCDNに記載（jQueryの後に設置）。

HTMLコピー<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js" integrity="sha384-LtrjvnR4Twt/qOuYxE721u19sVFLVSA4hf/rRt6PrZTmiPltdZcI7q7PXQBYTKyf" crossorigin="anonymous"></script>

 

パッケージマネージャー（Package managers）v4.5.2時点

Bootstrapのソースファイルを、最も人気のあるパッケージマネージャーを使用して、ほぼ全てのプロジェクトに取り込む。パッケージマネージャーに関係なく、公式のコンパイル済みのBootstrapのバージョンに一致するセットアップ用のSassコンパイラとAutoprefixerが必要。

npm

npmパッケージを使って、Node.jsで動くアプリケーションにBootstrapをインストール：

実行コード$ npm install bootstrap

require('bootstrap') は、BootstrapのjQueryのプラグインのすべてをjQueryオブジェクトに読み込む。bootstrap モジュール自体は何もエクスポートしない。パッケージの最上位ディレクトリの下にある /js/*.js ファイルを読み込むことで、Bootstrapのプラグインを個別に手動で読み込むことが可能。

Bootstrapの package.json は、次のキーの下にいくつかの追加のメタデータが組み込まれている：

• sass - BootstrapのメインのSassソースファイルへのパス
• style - デフォルト設定（カスタマイズなし）を使用したコンパイル済みのBootstrapの非軽量版CSSへのパス

yarn v4.2.1新設

yarnパッケージを使って、Node.jsで動くアプリケーションにBootstrapをインストール：

実行コードyarn add bootstrap

RubyGems

Gemfileに次の行を追加して、Bundler（推奨）やRubyGemsのアプリケーションを使って、RubyにBootstrapをインストール：

実行コードgem 'bootstrap', '~> 4.5.2'

Bundlerを使用していない場合は、次のコマンドを実行してgemをインストール：

実行コード$ gem install bootstrap -v 4.5.2

詳細については、Bootstrap Ruby GemのREADMEに記載。

Composer

また、Composerを使用してBootstrapのSassとJavaScriptをインストールして管理することも可能：

実行コードcomposer require twbs/bootstrap:4.5.2

NuGet

.NETで開発する場合は、NuGetを使用してBootstrapのCSSやSassとJavaScriptのインストールや管理が可能：

CSSの実行コードPM> Install-Package bootstrap

Sassの実行コードPM> Install-Package bootstrap.sass