問題タブ [gulp-clean-css]
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.
npm - gulp-clean-css は、フォントや画像などのアセットの url() に正しい相対パスを設定できません
パッケージ マネージャーとビルド システムに NPM と Gulp を使用しています。「gulp-sass」をインストールしてsassをサポートし、「gulp-clean-css」をインストールして、cssファイルをインラインで@importできるようにしました。「_frontend/scss/**/*」で SCSS ファイルをキャプチャし、「assets/frontend/css/styles.css」として単一のファイルにコンパイルします。出力場所には、"css" の兄弟である "fonts"、"img"、および "js" という他の重要なリソース フォルダーがあります。
私の問題は、「*.css」ファイルをインポートしているときに、ターゲットへの url() 相対パスを正しく取得できないことです。ただし、「.scss」ファイルをインポートしている場合は問題ありません。
これが私のコードです(質問を簡単にするためにソースマップ、エラーログなどを取り出しました):
GULPFILE.JS
メイン.SCSS
以下でOKです
出力は正しい相対パスで出力されるようです サンプル出力: url(../fonts/FontAwesome/fontawesome-webfont.eot?v=4.6.1)
以下はありません
サンプル出力: url(../node_modules/jquery-ui/themes/base/images/animated-overlay.gif) ^^ 上記は何らかの方法で「../node_modules」を追加します。 どういうわけかこれを「../img/vendor/jquery-ui/what/ever/i/like/here」に設定したい
これが私のディレクトリ構造です。
誰かがこれについて助けることができれば素晴らしいでしょう。
gulp - Gulp - 新しいバンドルが作成されたときに古いバンドルを削除する
私はgulpが初めてで、かなり単純に見えるビルドプロセスを作成するのに苦労していますが、それをクラックすることはできません.
私が達成したいのは、すべてのjsファイルとcssファイルをバンドルしてバンドルして、all_*.min.js where *
現在のタイムスタンプと同じように名前を付け、古いall_*.min.js
バンドルを削除することです。
私のもう1つの課題は、バンドルのファイルの1つが監視なしで変更されたときにバンドルの変更を検出する方法です。要するに、これが私が達成したいことです。どんな提案でも大いに役立ちます。
前もって感謝します。
css - Gulp タスク: CleanCSS とパス
次のことを想定した Gulp でタスクを作成しました。
- 複数の CSS ファイルを結合します。
- 不要な CSS を縮小 + 削除します。
url()
ディレクティブなどのパスを修正します。- ソース マップを生成します。
これに対する私の現在のコードは次のとおりです。
url()
ファイルから取得したパスの例Resources/Include/ionicons/css/ionicons.css
:
これは私の現在のファイル構造です:
テスト フォルダー: https://dl.dropboxusercontent.com/u/2333896/gulp-path-test.zip (インストールしてから で実行gulp deploy-css
)。
オプションを使用して CSS ファイルに画像またはフォントへの参照が含まれている場合を除いて、ほとんどすべてが期待どおりに機能しurl()
ます。タスクを実行 (およびstyle.min.css
作成) した後、これらの参照は壊れています。元の CSS ファイルにあるパスは変更されていません。
cleanCSS
参照されたファイルがどこにあるかを確認し、パスを自動的に修正することになっていませんか? それを制御するためにオプションtarget
とrelativeTo
使用されていませんか?
どうすればこれを修正できますか? ありがとうございました。
css - 縮小後に無効化された疑似クラスが機能しない
現在、次のプラグインを使用しています。
これは私のレイアウトです:
次に私のCSSで:
問題は、最適化された (縮小された) コードを実行すると、2 番目のセレクターが考慮されないことです。スタイルシートにあるのに
何か案は?
gulp - EACCES: gulp css minify でパーミッションが拒否されました、同じ src と dest
開発用に実行されるすべてのものを構築するための gulp タスクがあります (正常に動作します)。リリース gulp タスクでも同じことを行いますが、CSS を縮小するバンドル タスクも追加します。
css インラインを縮小したいだけです。つまり、ファイルの同じ src と dest を意味します。ただし、実行時に以下のエラーが発生します。
エラー: EACCES: 権限が拒否されました。開いています
ミニファイが開始する前にビルドタスクが終了したと表示されるため、競合状態に陥っているとは思わない
問題のタスクは次のとおりです。
別の宛先パスを指定すると問題なく動作しますが、それは避けたいと思います。このアクセスの問題を解決するにはどうすればよいですか?