4

そのため、新しいプロジェクトを生成し、その新しいプロジェクトのセットアップに伴うカスタマイズ/複雑さを最小限に抑えることができる環境をセットアップしようとしています。私は Structurer Pro (nettuts+ から) を使用してファイルセットを構築していますが、これは素晴らしいことです。MAC セットアップ用の github を用意したので、最新の Foundation フレームワーク ファイルを取得して現在のプロジェクトに配置できます。

今、私はLESSもプロセスに取り入れようとしています。ただし、Foundation の css ファイルは現在 LESS でセットアップされていません。つまり、2 つのオプションがあります...(1) 現在のバージョンを取得してそれらを LESS 化してから、それらのカスタマイズされたファイルを使用して新しいプロジェクトを作成します。(2)LESSを使用しないでください...

私が抱えているもう 1 つの問題は、LESS 用のコンパイラ (simpleLESS、CodeKit、LESS、compass) がかなりあるようですが、どれも css ファイルを結合していないことです! したがって、10 個の LESS ファイル (例: IE.less、mobile.less、grid.less、typography.less など) を設定し、それらに変数を含めた場合、出力として 10 個の css ファイルは必要ありません。出力として1つのコンパイル済みcssファイルが本当に必要です。これを手動で行うことも、Clean css や他の 30 のサイトのいずれかを介して行うこともできます...

しかし、最新のファイルを使用してプロジェクト フレームワークを作成し、色見本セットを一連の変数 (LESS) に適用してカスタマイズし、結果の CSS を実際の実装のためにコンパイルおよび結合できる「もの」が 1 つありますか? ?

4

3 に答える 3

2

Foundationはバージョン3でSCSSに移行することになったので、これは一種の論点になりました...

于 2012-10-29T23:53:57.697 に答える
1

あなたの質問のいくつかに答えようとしています:

  1. Foundation の .css ファイルの名前を .less に変更し、/less/ ディレクトリに配置します。
    • どの .css ファイルも有効な .less ファイルです (ただし、その逆はありません)
    • この CSS を LESS に変換する必要はありません。変更する部分だけに変換して、時間を節約してください ;)
  2. master.less ファイルで、これらのファイルを @import 'foundation-file'; でインポートします。
    • re: css/less ファイルの結合方法 :)
  3. master.less のみをコンパイルし、HTML に含めます。
    • master.less は、実際には @import ステートメントのみを含む可能性があると想定されるMAINスタイルシートです。私にとっては、この方法ですべてを管理する方が簡単です (および組み合わせが発生する場所)。master.css にコンパイルされ、それを使用します。
于 2012-01-17T09:01:47.887 に答える
0

css Foundationに何が含まれているのかわかりません。それが、reset.cssまたは同様のものである場合は、そのままにして、サイズを小さくしないでください。2つのcssファイルがあります。1つはreset.cssで、もう1つはstyles.cssです(後者はより少ないファイルからコンパイルされます)。

次に、さまざまなコンポーネントを@importsするstyle.lessを含む独自のセットアップを追加できます。これを十分に汎用化すると、さまざまなプロジェクトで再利用できます。

lesscコンパイラはさまざまなファイルの@importsを処理し、それらを1つのファイルに結合します。@ importsbase.lesscomponents.lessなどのstyles.lessがあります。styles.lessをstyles.cssにコンパイルするだけで、残りを処理します。 :

lessc styles.less styles.css

参照:https ://gist.github.com/1480684

于 2011-12-15T10:49:51.843 に答える