原文:Build tools
私たちのドキュメントを構築するために、ソース・コードをコンパイルするために、テストを実行するためなど、どのように、Bootstrapの組み込まれたnpmスクリプトを使用するかを学びます。
ツーリング設定
Tooling setup
Bootstrapは、そのビルド・システムにNPMスクリプトを使用します。私たちのpackage.jsonには、フレームワークで動作するための便利なメソッドが含まれています。コンパイルしているコード、実行テストなどが含まれています。
ローカルサイトで、私たちのビルド・システムと実行されたドキュメントを使用するために、あなたは、Bootstrapのソース・ファイルとNodeのコピーを必要とします。次の手順に従うと、ロックする準備ができているはずです。:
- 私たちの依存関係を管理するために使用するNode.jsをダウンロードして、インストールします。
- root /bootstrapディレクトリに移動します。そして、package.jsonで一覧にされる、私たちのローカル依存関係をインストールするために、npmのインストールを実行します。
- Rubyをインストールします。gem install bundlerで、Bundlerをインストールします。そして、最後に、bundleのインストールを実行します。これは、Jekyllとプラグインのような、すべてのRuby依存関係を設置します。
- Windowsのユーザー:問題なく稼働可能なJekyllを取得するために、このガイドをお読み下さい。
完了すると、あなたは、コマンド・ラインから提供される、さまざまなコマンドを実行することができます。
NPMスクリプトを使用する
Using NPM scripts
私たちのpackage.jsonには、次のコマンドとタスクが含まれています。:
タスク | 解説 |
---|---|
npm run dist | distを実行するnpmは、コンパイルされたファイルで、/distディレクトリを作成します。Sass、AutoprefixerとUglifyJSを使用します。 |
npm test | npmが、テストをローカルで実行するdist plusを実行するのと同じです。 |
npm run docs | ドキュメントのために、CSSとJavaScriptをビルドして、lintします。あなたは、続いて、npmを通じてdocs-serveを実行し、ローカルでドキュメントを実行することができます。 |
npm runを実行すると、すべてのnpmスクリプトが表示されます。
Autoprefixer
Bootstrapは、自動的に、build時間のベンダー接頭辞を、いくつかのCSSプロパティに追加するために、(私たちのbuild工程に組み込まれる)Autoprefixerを使用します。そうすることは、v3のようなベンダーのミックスインの必要性を排除しながら、私たちが、一度にCSSの重要な部分に記述できることで、私たちの時間とコードを保存します。
私たちは、私たちのGitHubリポジトリー内で、別々のファイルで、Autoprefixerによってサポートされるブラウザーのリストを保守します。詳細については、/package.jsonを参考にしてください。
ローカル・ドキュメント
Local documentation
ローカルで、私たちのドキュメントを実行することは、かなり、柔軟な静的サイト・ジェネレーターは、私たちに、提供するJekyllを使用する必要があります。:基本的なインクルード、Markdownに基づいたファイル、テンプレートなどがあります。ここに、それを開始させる方法があります。:
bundleのインストールと一緒に、Jekyll(サイト・ビルダー)と他のRubyの依存関係をインストールするためのツーリング設定を通じて実行します。
root /bootstrapディレクトリから実行されたnpmは、コマンド・ラインでdocs-serveを実行します。
あなたのブラウザーとvoilaで、http://localhost:9001を開きます。
Jekyllを使用する詳細については、そのドキュメントをお読みください。
トラブルシューティング
Troubleshooting
あなたが、依存関係のインストールに問題に遭遇した場合、以前のすべての依存バージョン(グローバルおよびローカル)をアンインストールします。続いて、npmのインストールを再実行します。