Bootstrap4.xの使い方をBootstrap3.xからの変更箇所を交えて解説しています。
ツールの構築（Build tools）
Bootstrapに含まれるnpmスクリプトを使用してマニュアルを作成したり、ソースコードをコンパイルして、テストを実行する方法などを学習する。
ツールのセットアップ（Tooling setup）v4.6.0ツール変更
Bootstrapは、構築システムにnpm scriptsを使用。package.jsonには、コードのコンパイル、テストの実行など、フレームワークを扱う便利なメソッドが組み込まれている。
構築システムを使用してドキュメントをローカルで実行するには、BootstrapのソースファイルとNodeのコピーが必要。次の手順に従えばロックする準備が整う：
- Bootstrapのソースファイルをダウンロードして解凍し、依存関係の管理に使用するためNode.jsをダウンロードしてインストール（※推奨版の方をインストール）
- BootstrapのソースをダウンロードするかBootstrapのリポジトリをフォーク。
- コマンドライン（ターミナル/コマンドプロンプト）で、解凍したBootstrapのソースファイルがあるルートの
/bootstrapディレクトリに移動し、npm installを実行して、package.jsonにリストされているローカル依存関係をインストール
完了すると、コマンドラインから提供されるさまざまなコマンドが実行可能。
【変更履歴】
npm scriptsを使用（Using npm scripts）v4.5.0ツール変更
package.jsonには、次のコマンドとタスクが組み込まれている：
| タスク | 説明 |
|---|---|
npm run dist |
npm run dist は、コンパイルされたファイルとともに /dist ディレクトリを作成。SassとAutoprefixerとterserを使用 |
npm test |
npm run dist と同じだが、ローカルでテストを実行 |
npm run docs |
ドキュメント用のCSS、JavaScriptを構築してlintでチェック。その後 npm run docs-serve 経由でドキュメントをローカルで実行 |
npm run を実行すると、すべてのnpmスクリプトが表示される。
Sassコンパイラ（Sass）v4.6.0追加
Bootstrap v4は、Node Sassを使用してSassソースファイルをCSSファイル（構築プロセスに組み込み済）にコンパイル。独自のアセットパイプラインを使用してSassをコンパイルするときに、同じ生成されたCSSを作成するには、少なくともNodeSassが提供する機能をサポートするSassコンパイラを使用する必要がある。2020年10月26日をもって、LibSassとその上に構築されたパッケージ（Node Sassを含む）は非推奨になったため、今後も注意することが重要。
新しいSass機能または新しいCSS標準との互換性が必要な場合、Dart SassはSassの主要な実装であり、NodeSassと完全に互換性のあるJavaScriptAPIをサポート（Dart SassのGitHubページにリストされているいくつかの例外を除く）。
ブラウザのround（角丸）の問題を防ぐために、Sassのroundの精度を6（デフォルト、Node Sassでは5）に上げている。Dart Sassを使用する場合、コンパイラは10のround精度を使用し、効率上の理由から調整不可なので、これを調整する必要はない。
Autoprefixer v4.2.1ファイル変更
Bootstrapは、Autoprefixer（構築プロセスに組み込まれている）を使用して、構築時にいくつかのCSSプロパティにベンダープレフィックスを自動的に追加。そうすることでCSSの重要な部分を一度に記述できるようになり、v3のようなベンダーのmixinが必要なくなるので、時間とコードを節約。
Autoprefixerを経由してサポートされているブラウザのリストは、GitHubリポジトリ内の別のファイルに保存されている。詳細は .browserslistrc（browserslistの項目）に記載。
【変更履歴】
- 【v4.0.0】
- v3.2.0で廃止されたVendor prefix mixinは削除
- サポート記載ファイル：
/build/postcss.config.js⇒package.json
- 【v4.2.1】
- サポート記載ファイル：
package.json⇒.browserslistrc
- サポート記載ファイル：
ローカルドキュメント（Local documentation）
ドキュメントをローカルで実行するには、基本的な組み込み、Markdownベースのファイル、テンプレートなどを提供するかなり柔軟な静的サイトジェネレータであるJekyllを使用する必要がある。開始方法は次のとおり：
- 上記ツールのセットアップをした後、
bundle installを実行し、Jekyll（サイト構築）と他のRubyの依存関係をインストール - コマンドラインで
/bootstrapルートディレクトリからnpm run docs-serveを実行 - ブラウザでhttp://localhost:9001を開く
Jekyllの使用方法の詳細については、Jekyllのマニュアル（英語）に記載。
※GitHubにある開発中のソースファイルのドキュメント（解説）をローカルで実行する場合は：
- Node.js、Ruby、Bundlerをインストール（ツールのセットアップを参照）
- "Clone or download"のボタンを押して、DownloadZIPファイルをダウンロードして任意の場所に解凍
- コマンドラインで、解凍したファイルの
/bootstrap-4-devルートディレクトリに移動して、bundle installを実行し、Jekyllと他のRubyの依存関係をインストール npm installを実行して、Node.jsの依存関係をインストール（node_modules/内にファイルが構築される）npm run distを実行して、dist/内のCSSおよびJavaScriptファイルを再構築npm run docs-serveを実行してドキュメントを構築（_gh_pages/内にファイルが構築される）- ブラウザでhttp://localhost:9001を開く
トラブルシューティング（Troubleshooting）
依存関係のインストールで問題が発生したときは、以前のすべての依存関係のバージョン（グローバルやローカル）をアンインストール（node_modules/ を削除し、npm cache verify を実行してキャッシュをクリアなど）し、npm install を再実行する。