ビルドツール

Bootstrap に含まれる npm スクリプトを使用して、ドキュメントの作成、ソース コードのコンパイル、テストの実行などを行う方法を学びます。

ツーリングのセットアップ

Bootstrap は、ビルド システムにnpm スクリプトを使用します。package.jsonには、コードのコンパイル、テストの実行など、フレームワークを操作するための便利なメソッドが含まれています。

ビルド システムを使用してドキュメントをローカルで実行するには、Bootstrap のソース ファイルと Node.js のコピーが必要です。次の手順に従ってください。ロックする準備ができているはずです。

1. 依存関係の管理に使用する Node.js をダウンロードしてインストールします。
2. ルート/bootstrapディレクトリに移動して実行し、 package.jsonnpm installにリストされているローカルの依存関係をインストールします。
3. Rubyをインストールし、 Bundlerをでインストールしてgem install bundler、最後に を実行しbundle installます。これにより、Jekyll やプラグインなど、すべての Ruby 依存関係がインストールされます。
   • Windows ユーザー:このガイドを読んで、Jekyll を問題なく起動して実行してください。

完了すると、コマンド ラインから提供されるさまざまなコマンドを実行できるようになります。

npm スクリプトの使用

package.jsonには、次のコマンドとタスクが含まれています。

実行npm runして、すべての npm スクリプトを表示します。

オートプレフィクサー

Bootstrap はAutoprefixer (ビルド プロセスに含まれています) を使用して、ビルド時に一部の CSS プロパティにベンダー プレフィックスを自動的に追加します。そうすることで、v3 に見られるようなベンダー mixin の必要性を排除しながら、CSS の主要部分を一度に記述できるようになるため、時間とコードを節約できます。

Autoprefixer でサポートされているブラウザーのリストは、GitHub リポジトリ内の別のファイルに保持されています。詳細については、 .browserslistrcを参照してください。

ローカル ドキュメント

ドキュメントをローカルで実行するには、Jekyll を使用する必要があります。Jekyll は、基本的なインクルード、Markdown ベースのファイル、テンプレートなどを提供する非常に柔軟な静的サイト ジェネレーターです。開始方法は次のとおりです。

1. 上記のツール設定を実行して、Jekyll (サイト ビルダー) とその他の Ruby 依存関係を .xml でインストールしbundle installます。
2. ルート/bootstrapディレクトリからnpm run docs-serve、コマンド ラインで実行します。
3. ブラウザで開いhttp://localhost:9001てください。

Jekyll のドキュメントを読んで、Jekyll の使用方法を学んでください。

トラブルシューティング

依存関係のインストールで問題が発生した場合は、以前のすべての依存関係バージョン (グローバルおよびローカル) をアンインストールします。その後、再実行しnpm installます。