WebPACKのURLローダJPGファイルをインライン

Question

私は、このようなURLローダを使用してJPGをロードするインラインしようとしています：

let image1 = require("url?limit=100000000!./samples/sample.jpg"); 

私が手に実行した後：

"data:image/jpeg;base64,bW9kdWxlLmV4cG9ydHMgPSBfX3dlYnBhY2tfcHVibGljX3BhdGhfXyArICIuL3d3d3cvaW1nL3NhbXBsZS5qcGciOw==" 

ベース64文字列としてデコード：

module.exports = __webpack_public_path__ + "./wwww/img/sample.jpg"; 

私は、バイナリファイルのbase64文字列を期待していました。

これが期待どおりの動作ですか？実際にバイナリファイルのbase64文字列をどのように達成できますか？

もし私がインラインにしようとすると、それは期待どおりに動作します。なぜかjpgsではないのですか？

この特定のファイルのファイルサイズは417 KBですが、limitパラメータの方がはるかに大きいです。

Answer 1

私はそれを試していないが、このようなものが動作するはずです：

のlet画像1は=（ "!! URLリミット= 100000000 ./サンプル/ sample.jpgの？！"）が必要です。

問題はローダの順序です。 webpack.configファイルを確認すると、file-loaderのファイルがあります。jpgファイルです。

module.exports = \__webpack_public_path__ + "./wwww/img/sample.jpg"; 

... url-loaderにパイプされている：私はfile-loaderだろう出力このことを知っているので知っています。だからこそ上記の文字列のbase64版を取得しているのです。 file-loaderはそれをurl-loaderに戻しているためです。

無効にする方法については、loader order documentationを参照してください。私は置くと思う！前にあなたの問題を解決します。