web-dev-qa-db-ja.com

bowerでbootstrapを使用する

Bowerでbootstrapを使用しようとしていますが、リポジトリ全体を複製するため、CSSなどはありません。

ビルドプロセスにBootstrapを含める必要があるということですか?または私が間違っている場合、正しいワークフローは何ですか?

135
xavier.seignard

私は最終的に次の使用を終了しました:bower install --save http://Twitter.github.com/bootstrap/assets/bootstrap.Zip

リポジトリ全体を複製するのではなく、必要なassestsを解凍するだけなので、私にはわかりやすいようです。

その欠点は、bower updateがブートストラップを更新しないため、バウアーの哲学を破ることです。

しかし、bower install bootstrapを使用してから、ワークフローでbootstrapを作成するよりもまだきれいだと思います。

それは私が推測する選択の問題です。

Update:は、distフォルダーをバージョン管理しているようです(参照: https://github.com/twbs/bootstrap/pull/6342 )、したがって、単にbower install bootstrapを使用し、distフォルダー内のアセットをポイントします

84
xavier.seignard

Bootstrap-cssと呼ばれるビルド済みのbootstrap bowerパッケージがあります。これがあなた(そして私)が見つけたいと思っていたものだと思います。

bower install bootstrap-css

ニコありがとう。

77
Terry Roe

Cssおよびjsファイルはパッケージ内にあります:bootstrap/docs/assets/

UPDATE:

v3以降、パッケージにはすべてのcss、js、およびフォントを含むdistフォルダーがあります。


別のオプション(単一のファイルを取得する場合)は、 pulldown です。設定は非常に簡単で、リストに独自のファイル/ URLを簡単に追加できます。

27
tborychowski

npmがインストールされ、bowerがグローバルにインストールされていると仮定します

  1. プロジェクトに移動します
  2. bower init(これにより、ディレクトリにbower.jsonファイルが生成されます)
  3. (その後、[はい]をクリックし続けます)...
  4. bootstrapがインストールされるパスを設定するには:
    bower.jsonファイルの隣に手動で.bowerrcファイルを作成し、以下を追加します。

    {"ディレクトリ": "パブリック/コンポーネント"}

  5. bower install bootstrap --save

注:他のコンポーネントをインストールするには:

 bower search {component-name-here}
4
Mahmoud Zalt

プロジェクトを最初にチェックアウトするときに一度だけ実行する必要があるシェルスクリプトに行き着きました

#!/usr/bin/env bash

mkdir -p webroot/js
mkdir -p webroot/css
mkdir -p webroot/css-min
mkdir -p webroot/img
mkdir -p webroot/font

npm i
bower i

# boostrap
pushd components/bootstrap
npm i
make bootstrap
popd
cp components/bootstrap/bootstrap/css/*.min.css webroot/css-min/
cp components/bootstrap/bootstrap/js/bootstrap.js src/js/deps/
cp components/bootstrap/bootstrap/img/* webroot/img/

# fontawesome
cp components/font-awesome/css/*.min.css webroot/css-min/
cp components/font-awesome/font/* webroot/font/
3
slf

次のようなコマンドを使用することも忘れないでください。

bower search Twitter

Twitterに関連するパッケージのリストで結果が得られます。これにより、たとえば、新しいバウアーコンポーネントがあるかどうかを知るなど、Twitterやバウアーに関するすべての情報を最新の状態に保つことができます。

2
joaquindev

npmコマンドを実行するために、システムにinstallnodeJsがあります。 npmが正常に機能したら、bower.ioにアクセスできます。このトピックに関する完全なドキュメントがあります。コマンド$ npm install bowerがあります。これにより、マシンにbowerがインストールされます。 bowerをインストールした後、Bootstrapを簡単にインストールできます。

これに関するビデオチュートリアルがあります

0
asad khan