2013-03-24 10 views
26

cssファイルにすべての少ないファイルを置き換えます.4.0それはもう動作しません。うなり声は、私はこれを使用して、CSSファイルにすべての私の小さいファイルを変換するためにうなり声を使用

次のコード(宛先では*を使用しない)は両方のバージョンで動作するため、宛先ファイルの星に問題があります。

less: { 
    development: { 
    files: { 
     "css/test.css": "less/*.less" 
    } 
    } 
} 

+0

あなたが間違いなくhttp://gruntjs.com/contributingを指している場合は、使用しているソフトウェアにバグがある場合は報告してください。 (うまくいけば、アップグレードした後でも、あなたのソフトウェアを作った人が最初に尋ねるグループです)。彼らはIRCチャンネルを持っています。それは答えへの最速ルートになるでしょう。 –

+0

これはここで答えられましたhttp://stackoverflow.com/questions/15094667/compile-less-files-with-grunt-contribless-wont-work – jdewit

答えて

42

これはバグではありません。 Gruntは、その設定を使用してdestでグロビングをサポートしなくなりました。しかし、あなたはこのような「ファイル列」形式を、使用することができます。

また
files: [ 
    { 
    expand: true, 
    cwd: 'src', 
    src: ['*.less'], 
    dest: 'assets/css/', 
    ext: '.css' 
    } 
] 

、あなたはブートストラップのようなライブラリを使用して、別の、個別のCSSファイルに各LESSファイル(コンポーネント)を構築したい場合は、 「すぐに」実現するのは簡単ではありません。なぜなら、各LESSファイルは、variables.lessmixins.less(そしてforms.lessnavbar.lessのような他の2つのファイルは、他のファイルで参照されているため)独自の@import文を持つ必要があるからです。

これを本当に簡単にするには、Gruntプラグインassemble-less(免責事項:私はプロジェクトのメンテナーの一人で、less.jsのコアチームにもいる)を試してみてください。 assemble-lessはTyler Kellenのgrunt-contrib-lessフォークですが、必要なものを実現するいくつかの実験的な機能が追加されています(安定性が必要な場合はgrunt-contrib-lessを使用してください)。たとえば:

// Project configuration. 
grunt.initConfig({ 

    less: { 
    // Compile all targeted LESS files individually 
    components: { 
     options: { 
     imports: { 
      // Use the new "reference" directive, e.g. 
      // @import (reference) "variables.less"; 
      reference: [ 
      "bootstrap/mixins.less", 
      "bootstrap/variables.less" 
      ] 
     } 
     }, 
     files: [ 
     { 
      expand: true, 
      cwd: 'bootstrap/less', 
      // Compile each LESS component excluding "bootstrap.less", 
      // "mixins.less" and "variables.less" 
      src: ['*.less', '!{boot,var,mix}*.less'], 
      dest: 'assets/css/', 
      ext: '.css' 
     } 
     ] 
    } 
    } 
    ... 
} 

imports機能は、基本的に、ソースファイルへの指定@import文を付加します。 referenceオプションを使用すると、mixinや:extendで特に参照されているスタイルだけを出力しながら、他の少ないファイルを参照することができます。ブートストラップは、forms.less、buttons.lessなどの他のコンポーネントからスタイルを相互参照するため、ここに示す数よりもいくつかのファイルを参照する必要があります(例についてはthe Gruntfile in assemble-lessを参照してください)。)

したがって、上記の例で構成されたassemble-lessタスクを実行した後、assets/cssフォルダを持っているでしょう:

  • alerts.css
  • badges.css
  • breadcrumbs.css
  • button-groups.css
  • buttons.css
  • carousel.css
  • close.css
  • code.css
  • component-animations.css
  • dropdowns.css
  • forms.css
  • glyphicons.css
  • grid.css
  • input-groups.css
  • jumbotron.css
  • labels.css
  • list-group.css
  • media.css
  • modals.css
  • navbar.css
  • navs.css
  • normalize.css
  • pager.css
  • pagination.css
  • panels.css
  • popovers.css
  • print.css
  • progress-bars.css
  • responsive-utilities.css
  • scaffolding.css
  • tables.css
  • theme.css
  • thumbnails.css
  • tooltip.css
  • type.css
  • utilities.css
  • wells.css

あり、このお手伝いをする必要があり、他の機能がありますが、それはあなたのことができますので、imports機能は超強力ですGruntfileに直接ディレクティブを追加します。

+1

あなたはもはやサポートを意味しませんか?それほど指向的ではないのですか?または任意のdestパラメータのために? – user544262772

関連する問題