webpack打包含有图片url的css时候,报Cannot resolve module url-loader

Question

我想将css和js以及图片压缩打包，css中有background属性设置了图片，当运行webpack命令后出现了如下提示，打包失败，但是去掉了css中带有图片的background属性，打包就成功了，但是我需要将图片打包。

另外css文件不在webpack/accordion目录下，而是在其他的位置。

出错提示如下：

webpack.config.js如下：

package.json如下：
][4]

目录结构如下：

怎么才能打包成功呢。

Answer 1

Module not found: Error: Cannot resolve module url-loader的意思是没找到你的url-loader。

但看你的denpendencies里又确实有她，那你先确认下你的node_modules目录下是否有url-loader文件夹吧

Answer 2

如果是css文件且打包的时候报如下错误：

ERROR in ./~/css-loader?minimize!./~/postcss-loader!./static/css/icheck-skins/all.css
Module not found: Error: Cannot resolve 'file' or 'directory' ./minimal.png in /Users/spider/Desktop/StrategySeller/static/css/icheck-skins
 @ ./~/css-loader?minimize!./~/postcss-loader!./static/css/icheck-skins/all.css 6:180-204

使用resolve-url-loader可以解决你的问题。
参考配置如下：

    {
        test: /\.css/,
        loaders: ["style", "css?minimize","resolve-url-loader", "postcss"]
    }

Answer 3

你好我也是花了好久时间才解决的，如果行，给个赞O(∩_∩)O哈！
我也是无意间看见github上面的github解释

官网上的两句话意思很明显
要使用相对于网站根目录的路径不要这样写../../要从根目录这样写/../..

对了，如果不行可能像楼上说的少了一个resolve-url-loader这东东~