Laravel 为 url() 混合禁用文件加载器

Laravel Mix disable file loader for url()

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

我怎样才能禁用它?

我尝试删除 webpack.config.js 中的以下代码:

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

但是 运行 命令 npm run dev 产生了这个错误:

You may need an appropriate loader to handle this file type.

Laravel 混合版本 0.8 及以上

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

中设置以下选项
mix.options({
    processCssUrls: false
});

Laravel 混合版本 0.7 及以下

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

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

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

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

替换为

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

解决方案 2:在 url()

中使用绝对 link

/ 开头的 URL 将不会被处理 例如:url(/images/something.jpg)。如果你的项目支持url以/开头,你可以直接使用不会有任何问题。