1

すべてのプロジェクトの前に私が直面する最大のジレンマは、Bootstrap 全体を使用する必要があるのか​​、それとも必要な部分だけを使用する必要があるのか​​ということです。私はこれを決めるのに多くの時間を無駄にしました。

これまでの私のセットアップは次のようになっています。

less ディレクトリを twitter/bootstrap から stylesheets ディレクトリにコピーします

├── bootstrap
│   ├── layouts.less
│   └── more...
├── fonts.less
├── mixins.less
├── mysite.less
├── plugins.less
└── variables.less

plugins.less必要なブートストラップの少ないファイルを含めるファイルを作成します。次のようになります。

  @import "bootstrap/layouts.less";
  @import "bootstrap/type.less";
  @import "bootstrap/forms.less";
  @import "bootstrap/buttons.less";
  @import "bootstrap/utilities.less";

次に、main.lessファイル内でこの plugins.less を使用します。

  @import "fonts.less"
  @import "variables.less"     // Bootstrap's + my variables
  @import "mixins.less"        // Bootstrap's + my mixins
  @import "plugins.less"
  @import "mysite.less"

私が見たブログ投稿と議論から、ほとんどの人は単にbootstrap.css、bootstrap-responsive.cssを含め、custom.cssでスタイルを上書きしているようです. これによりプロジェクトの "ブートストラップ" ping 時間が最小限に抑えられることは理解していますが、肥大化とメンテナンスについて心配しています。この方法を使用すると、インスペクターで何百ものスタイルがオーバーライドされていることがわかります。また、ブートストラップで使用されるクラス名を誤って使用する場合があります。

私が使用する方法に欠点はありますか？または、http://twitter.github.com/bootstrap/customize.htmlを使用して、いくつかのクラスをオーバーライドする必要がありますかcustom.less?

4

3 に答える 3

1

個人的には、プロジェクトに必要なファイルを少なくしてから、指定されたクラスをカスタマイズして必要なことを行います。カスタム クラスを追加する必要がある場合は、custom.less で行います。

ただし、各プロジェクトは異なるため、Bootstrap を機能させてください。サイトは何年も維持される予定ですか？おそらく、時間をかけて未使用の less ファイルを削除し、既存のクラスを変更して必要なことを行いたいと思うでしょう。プロジェクトを迅速に完了する必要があり、おそらくサイトの寿命が短い場合は、すべての .less ファイルを含めて、custom.less を上書きしてください。

また、Bootstrap バージョン 3 では、以下のすべてが 1 つのファイルhttp://blog.getbootstrap.com/2012/12/10/bootstrap-3-plans/にまとめられることを知っておくと役立つ場合があります。個人的には、多数の .less ファイルを操作するよりも、1 つの大きなファイルを操作する方が好きです。

于 2012-12-18T15:15:57.860 に答える
0

これは私のセットアップがどのように見えるかです：

|-bootstrap (as cloned from github)
|
|-css
| |-app.css
| |-app.less (watched by LESS compiler)
|
|-js
| |-app.js
| |-plugins
|
|-img
|  
|-index.html

ターミナルからlessコンパイラを呼び出してコンパイルするapp.lessファイルにブートストラップファイルを含めます（これをhtmlテンプレートにリンクします）

このようにして、いつでも安全にブートストラップをアップグレードできます (単純なgit pullブートストラップ フォルダを使用)。

于 2013-10-07T09:11:15.217 に答える