問題タブ [sass-loader]
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.
angular - UglifyJSの問題を伴うAngular2 webpack raw!sassローダー
angular2 アプリケーション バンドルを構成するために webpack を使用します。
ページのデザインにはsassを使用しています。
コンポーネント スタイルの sass を解決するローダー チェーンは次のとおりです。raw!sass
縮小せずに開発に使用すると、すべて正常に動作します。
UglifyJS プラグインを使用すると、デザインが壊れ、インポートされた css クラスのクラス位置が変更されます。
私のコンポーネント:
スタイルの私の webpack 設定:
scss ファイル:
UglifyJS を使用すると、マテリアライズ ライブラリからのクラスの順序が乱れます。
scss ファイルをコンパイルして css ファイルが必要な場合は問題なく動作しますが、この方法でファイル内の何かを変更すると_colors.scss、webpack がそれを探すことを知らないため、scss ファイルを自分でコンパイルする必要があります。
誰でも私を助けることができますか？ありがとう！
angular - Webpack: scss ファイルに背景画像をロードしても表示されない
背景画像を含むファイルをロードするために webpack sass-loaderを使用しようとしています。.scssの一部.scssは
私のwebpack構成ファイルの対応するローダーは次のように設定されています
私の.scssファイルは にsrc/app/components/login/あり、画像は にありsrc/images/ます。webpack の出力フォルダーは、フォルダーdistと同じレベルsrcです。
問題は、使用するbackground: url(require("../../../images/cloud_two.png"));とエラーは発生しませんが、背景画像が表示されないことです。
を使用するbackground: url("../../../images/cloud_two.png");と、404 エラーが発生しますhttp://localhost:8080/images/cloud_two.png。
sass-loaderのreadme にはProblems with url(...)セクションがありますが、私のケースを修正できません。
webpack - Webpack が背景画像を読み込んでいない
画像を読み込もうとしています：
私のstyle.scssで、それが機能していません
これが私のwebpack.configです：
ファイルローダーを使用していますが、ブラウザでレンダリングされた URL が画像の URL と一致しません。
ソースマップを使用していないと思います: https://github.com/webpack/style-loader/issues/55
誰でも助けることができますか？
sass - ネストされたルートで壊れた Webpack SCSS 画像 URL リンク
これが私のディレクトリ構造です：
と：
と：
シングル レベル ルートをロードすると、イメージ リンクが正しく機能します。
たとえば/search、画像リンクでレンダリングされurl(images/img-75fa3d.png)、動作します。
ただし、(React Router 経由で) ネストされたルートに移動すると、たとえば/properties/1、画像リンクは同じで、相対リンクであるため正しい画像の場所を見つけることができません: url(images/img-75fa3d.png)。
この例の画像は ですlogo-b-green.png。
編集：
をセクションに追加したpublicPathところ、outputうまくいきました。これで、URL がルートになります。これがこれを処理する正しい方法であることを誰かが確認できますか?
sass - 現在の webpack 構成で sass-loader から有効な css を取得するにはどうすればよいですか?
会社用のパターン ライブラリを作成しようとしています。次のソフトウェアを使用しています。
- css-loader@0.23.1
- extract-text-webpack-plugin@1.0.1
- node-sass@3.8.0
- sass-loader@4.0.0
- style-loader@0.13.1
- webpack@1.13.2
- resolve-url-loader@1.6.0
- node@6.3.1
- npm@3.10.3
私のコンピューター（Windows 10）で。
私の目標は、@import "colors"ステートメントを使用して、対応するファイルを取得することです../patterns/globals/_colors.css。includePathssass-loader と resolve-url-loader を property で設定してみましたroot。しかし、どちらも今のところ機能していません...
sass-loader と includePaths を使用した最初の実行で、次のエラー レポートが表示されました。
resolve-url-loader を 2 回実行した後、別のエラー レポートが表示されました。
II は、次の内容で単純な sass をコンパイルしようとします。
上記の webpack 構成では、エラー メッセージは表示されませんが、次のような無効な CSS コードが表示されます。
失敗の原因がどこにあるのかわかりません。
敬具、JBrieske
編集: @IRus の助けを借りて、問題を解決できました。