webpack單獨(dú)分離打包c(diǎn)ss，css里引用的圖片路徑錯(cuò)誤，怎么解決？

現(xiàn)在我的這個(gè)項(xiàng)目是將css和js單獨(dú)打包出來(lái)，打包后的目錄結(jié)構(gòu)和打包前一致。

打包前：

從這張圖可以看到，如果是css文件夾根目錄下的css文件引用images文件夾下的圖片應(yīng)該使用../就可以了，如果是css下某一個(gè)文件夾下面的css引用圖片的話(huà)，就要往上層目錄跳兩層../../

打包后：

webpack.config.js

var webpack = require('webpack');
var glob = require('globby') 
var utils = require('utils');
var htmlWebpackPlugin = require('html-webpack-plugin');
var nodeExternals = require('webpack-node-externals');
var CompressionPlugin = require("compression-webpack-plugin");
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var CSS_PATH = {
  css: {
    pattern: ['./public/css/**/*.css' ,'!./public/css/index.css'],
    src: path.join(__dirname, './public/css/'),
    dst: path.resolve(__dirname, 'build/public/css/'),
  }
}
function getCSSEntries(config) {
  var fileList = glob.sync(config.pattern)
  console.log(fileList)
  return fileList.reduce(function (previous, current) {
    var filePath = path.parse(path.relative(config.src, current))
    var withoutSuffix = path.join(filePath.dir, filePath.name)
    previous[withoutSuffix] = path.resolve(__dirname, current)
    return previous
  }, {})
}
module.exports = [
  {
    target:'web',
    externals: [nodeExternals()],
    devtool: 'cheap-module-eval-source-map',
    context: path.resolve(__dirname),
    entry: getCSSEntries(CSS_PATH.css),
    output: {
      path: CSS_PATH.css.dst,
      filename: '[name].css'
    },
    module: {
      rules: [
        {
          test: /\.css$/,
          use: ExtractTextPlugin.extract({
            use: "css-loader",
            publicPath:'../'
          })
        },
        {
          test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
          use: 'url-loader?limit=20000&name=[name].[ext]', 
        },
        {
          test: /\.scss$/,
          loaders: ["style", "css", "sass"]
        },
      ]
    },
    resolve: {
      extensions: ['.css']
    },
    plugins: [
      new ExtractTextPlugin('[name].css'),
    ]
  },
]

結(jié)果

打包完成后啟動(dòng)項(xiàng)目，本來(lái)那些css根目錄下的css引用的圖片路徑有一部分錯(cuò)誤了。

css根目錄下的css文件圖片路徑

請(qǐng)問(wèn)各位大神，這個(gè)問(wèn)題用什么辦法可以解決？可以把對(duì)應(yīng)的圖片打包到對(duì)應(yīng)的文件夾下嗎？我是一個(gè)webpack菜鳥(niǎo)，配置有點(diǎn)雜亂，望各位大神見(jiàn)諒?。?！