問題タブ [gulp-sass]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
73 参照

html - ubuntuサーバーでGulp SASS random()が失敗する

random()ubuntu サーバーでコンパイルするときに、sassの機能に問題があります。

現在、ローカルでは正常に動作していますが、ubuntu ボックスで gulp タスクを実行するとgulp-sass、出力は 1 回しか生成されません。

これはサスです:

これは、gulp-sass を使用した場合の ubuntu ボックスの出力です。

ご覧のとおり、出力が毎回ランダムであるローカルマシンとは異なり、乱数を1回だけ生成し、すべての繰り返しに同じ値を使用します。

その後、sass コンパイラを grunt 以外で使用しようとするとsass sass/default.css style/default.css、random() は完全に失敗します。

random() を正しくコンパイルするために、ubuntu ボックスにインストールする必要があるものはありますか? 私はいつもそれがsassでネイティブになったと思っていました。

正しいコンパイルのデモを行う SassMeister は次のとおりです

0 投票する
1 に答える
1134 参照

node.js - Gulp コマンドがエラーで停止します: spawn ENOTDIR

同様の質問がたくさんあることは認識していますが、私が見つけることができる解決策はありません。

Sass と JS をコンパイルしようとしていますが、次のエラーが発生します。

チョークポイントはreturn sass(...)ステートメントのようです。私gulpfile.jsはこのように見えます:

  • OS X ヨセミテ 10.10.3
  • ルビー v2.0.0p481
  • ジェム v2.0.14
  • ノード v0.12.3
  • NPM v2.9.1
  • ガルプ v3.8.11
0 投票する
1 に答える
1393 参照

javascript - gulp-sass プラグインを使用して Gulp タスクのパフォーマンスを向上させる方法は?

約 25 秒でコンパイルされる長いループ (約 800 行の CSS を生成) を持つ sass ファイルがあります。長過ぎます。

コンパイル時間を最小限に抑えるにはどうすればよいですか?

ありがとう!

0 投票する
1 に答える
684 参照

javascript - gulp-sass と gulp-watch、scss の保存時にファイルが見つからない

現在、gulpfile をセットアップしていますが、watch タスクが scss タスクを実行しているときに gulp-sass に問題があります。

これは私の gulpfile.js がどのように見えるかです:

base.scss にはこれのみが含まれます: (ファイル拡張子なしでフルパスも試しました。同じ結果)

コンソールに表示されるエラー:

基本的なエラーは次のとおりです: 1:9 インポートするファイルが見つからないか読み取れません: ./src/scss/modules/modules_base.scss

アプリの構造:

エラーは、modules_base.scss を保存して監視タスクが起動されたときにのみ発生し、デフォルト タスクを実行しているときには発生しません。

すべての提案は大歓迎です!

注: ノード -v : 0.12.0 Gulp: 3.8.11 gulp-sass: 2.0.1

0 投票する
1 に答える
468 参照

sass - Web Starter Kit SASS がコンパイルされない

Web スターター キットで SASS を使用していますが、SASS をコンパイルしていないようです。私のCSSファイルは次のように構成されています:

- - - - アプリ

----------資産

-----------------styles/

-----------------------app.css

-----------partials/

-----------スクリプト/

-----------scss/

---------------_bootstrap.scss

---------------_custom.scss

---------------_main.scss

---------------app.scss

REQUIRE SASS MODULED var sass = require("gulp-sass")

私の Gulp.js ファイルには、次のタスクが含まれています。

WATCH SCRIPT (edited) // ファイルの変更とリロードを監視

完全な Gulp ファイル:

0 投票する
1 に答える
454 参照

gulp - win7 での gulp-sass または gulp-ruby-sass による構文/依存関係の問題の解決

そのため、Gulp を初めて使用する多くの人と同じように、開発マシン (win7、xampp、drupal) で gulp-sass または gulp-ruby-sass を適切に動作させるのに苦労しています。

私の質問は非常に単純です: livereload を使ってブラウザに sass コンパイルを実行するにはどうすればよいですか?

コンパスウォッチまたはバンドル exec ガードを使用して SASS が正しくコンパイルされることを確認できますが、drupal で Omega4 を使用して設定された通常の livereload は非常に遅いです。gulp/grunt を調べるように提案されたので調べてみましたが、設定が簡単であると報告されている gulp を選択しました。

また、Web サーバーのルートに gulp を正しくインストールしました。コマンド ラインを使用して、gulp ファイル内のいくつかの関数を個別に、または gulp を介してファイル全体として呼び出すことができます。

私が抱えている問題は、gulp-sass も gulp-ruby-sass も機能しないということです!

gulp-ruby-sass を使用すると、arguments to path.join must be stringsエラーが発生します。エラーは、この関数の 2 行目で発生します。

gulp-sass でエラーが出るfile to import not found or unreadable: variables/**/*

このエラーは、src/return sass ラインでも発生します。gulp-ruby-sass のバージョン間の構文が変更されたことは知っていますが、新しい構文の変更はどれもうまくいきませんでした。また、gulp-sass にはファイルのグロビングの問題 (?!) はありません。

これを実現するために必要な依存関係または構文の組み合わせについて、私は途方に暮れています。

参考までに、ここに私の gulpfile と参考用の依存関係があります。

前もって感謝します。

0 投票する
0 に答える
115 参照

node.js - コンパイル済み出力と同じソースマップ コンテンツ - Windows の場合

問題

gulp-sourcemapsコンパイル済みの sass のソースマップを生成するために使用しています。

これは、Linux/Mac コンピューターでは機能するようですが、Windows では機能しません。実際のソース sass の代わりに、ソースマップの内容は生成された css と同じです。

PS私は実際のソースファイルを公開してリンクしたくありません。それらをソアマップに埋め込んでほしい。


詳細

私が使用している完全なgulpタスクは次のとおりです。

そして、フォルダ構造は次のとおりです。


さらに詳しく

Node v0.12.4 で Windows 7 を実行しています。グローバルgulpバージョンは 3.9.0 です。

これが私のpackage.jsonファイルです:

の元のソース コンテンツは次のapp.scssとおりです。

生成された CSS ファイルは次のとおりです。

最後に、ソースマップ ファイル (整形済み) を次に示します。


結論

上記のすべてからわかるようにsourcesContent、ソースマップ ファイル内の は、生成された CSS とまったく同じです。これにより、ソースマップはかなり役に立たなくなります。

ここで何が間違っていますか?どうすれば修正できますか?


これらのファイルのダウンロードは次のとおりです: gulp-sass-autoprefixer-sourcemaps.zip

テストするには: 抽出してから実行しnpm install && gulp cssます。