2016-08-29 5 views
1

テンプレートを購入しました。コンパイル済みのバージョンのブートストラップを使ってコンパイルしようとすると、問題はありません。私は、ブートストラップレスバリアントをコンパイルする場合はプリコンパイルと同じバージョンを得るためにブートストラップをコンパイルするには?

@import "bootstrap.css"; //Precompiled Bootstrap 
@import "nifty/nifty.less"; //My theme 

は、しかし、いくつかの色が他のですその後、予想:

@import "bootstrap/bootstrap.less"; //Same Version as above, but not precompiled 
@import "nifty/nifty.less"; //My theme 

違いは何ですか。ブートストラップをコンパイルすると、色の点でdistフォルダ内のプリコンパイルされたバリアントとまったく同じ結果が得られますか?

Kendo UIと一緒にテンプレートをコンパイルする必要があり、テンプレートが剣道UIブートストラップマッパーに必要なすべてのテーマ変数を提供するわけではないので、これが必要です。


これは私の一気の作業です:

gulp.task('theme', 
    function() { 
     return gulp.src('./Content/less/theme.less') 
      .pipe(plumber()) 
      .pipe(less({ 
       paths: [path.join(__dirname, 'less', 'includes')] 
      })) 
      .pipe(gulp.dest('./Content/theme')); 
    }); 
+0

Gulpfileの少ないタスクからコードを投稿できますか? –

+0

また、端末でlesscを使って直接コンパイルするとどうなりますか? I.これは期待される結果をもたらすのでしょうか、同じ問題がありますか? –

+0

私はgulpfile @ AndrewFaulknerを追加しました。最後の方法はわかりません。私はVisual Studioを使用します。 –

答えて

1

いくつかの可能性の問題がここにあります

  1. あなたは、あなたのプロジェクトにインストール同等のブートストラップCSSとブートストラップレスのバージョンを持っていないかもしれません。 bootstrap.cssファイルの一番上に表示されているバージョンが、ブートストラップの先頭にあるバージョンと同じであることを確認します。これが最も可能性の高い原因です。これらは簡単に外れてしまうことがあります。
  2. 最新のgulp-lessバージョンを使用していることを確認してください。このプラグインには過去の輸入処理に関する問題が報告されていたが、これは修正されている。
  3. Gulp-lessはインポートオーダーを尊重していない可能性があります。過去にこの問題が報告されています。これが問題であれば、少し時間がかかります。しかし、これが当てはまる場合には、ハッピーな解決策があります:ブートストラップライブラリファイルをgulpで直接取得し、ソース(例えばstyles/lib/bootstrap)のcssファイルに出力してから、出力しますCSSファイル。絶対最後の手段としてこれを行う - それは主要な、主要なハックです。
  4. テンプレート自体には、インストールしたブートストラップとは異なるバージョンのブートストラップが含まれている場合があります。テンプレートの依存関係を確認するには、テンプレートをチェックしてください。
+0

ありがとう、私はそれを調べる。最も可能性が高いのは3番目のようです。最新のgulp-lessバージョン(NPMパッケージjson '" gulp-less ":" * "')を使用し、bootstrap.css/lessファイルは同じダウンロード(3.3.6、テンプレートはuptodateではないので3.3.7) –

+0

あなたのバージョンをロックしてください!あなたがしなければ、あなたは後で多くの痛みを引き起こすでしょう。それはおそらくあなたの現在の問題には関係しませんが、それでも良い考えです。 –

+0

Hm ...あなたのプロジェクトにはbootstrap-lessもインストールされていないことを確認してください。 import 'ブートストラップ'; node_modules/bootstrap/[/ *?] bootstrapではなく、node_modules/bootstrap-lessにデフォルト設定することができます。less –

関連する問題