php - Laravel Mix 禁用 url() 的文件加载器

Question

Laravel 5.4 引入了 laravel mix 和 webpack。在 laravel mix 中处理图像没有明确的文档（例如，它是如何工作的以及根据我们的需要对其进行自定义）。由于它没有按我的预期工作，我想为我当前的项目禁用它。

我怎么能禁用它？

我尝试在 webpack.config.js 中删除以下代码：

{
     test: /\.(png|jpg|gif)$/,
     loader: 'file-loader',
     options: {
         name: '[name].[ext]?[hash]'
      }
}

但运行命令npm run dev会产生此错误：

您可能需要适当的加载程序来处理此文件类型。

score 18 · Accepted Answer

Laravel Mix 0.8 及以上版本

与 laravel mix v0.8 一样，有简单的 api 选项可以做到这一点。要禁用 url() 文件加载器，请在以下选项中设置webpack.mix.js

mix.options({
    processCssUrls: false
});

解决方案 1：禁用 url() 处理

url() 被解释为css-loader 的导入。目前 CSS-Loader 是一种全有或全无的方法，所以我们需要禁用所有 url() 处理，这样做..

打开node_modules\laravel-mix\setup\webpack.config.js并进行以下更改，

{ loader: 'css-loader' + sourceMap },

用。。。来代替

{ loader: 'css-loader?url=false' + sourceMap.replace("?", "&") },

解决方案 2：在 url() 中使用绝对链接

以 , 开头的 URL/将不会被处理，例如：url(/images/something.jpg) . 如果您的项目支持以开头的 url /，您可以按原样使用，不会有任何问题。