Wrong url addresses in CSS after bundling - css

Question

When I bundling CSS from packages in node_modules, I get trouble with relativity of paths.
In original stylesheets images are requested from child folder. After bundling through Webpack folder names are right, but there is no ../ before path to image.
Attaching all, what I can provide, including project folder structure and webpack's config.
vendor.scss
#import "~leaflet/dist/leaflet.css";
#import "~leaflet-draw/dist/leaflet.draw.css";
#import "~leaflet-easybutton/src/easy-button.css";
Image imports in original leaflet.draw (css and html are in one folder)
url('images/[filename].[ext]')
Image imports after bundling (css is in child folder)
url('img/[filename].[ext]')
Folders structure
node_modules/
- leaflet-draw/
- - dist/
- - - leaflet-draw.css
- - - images/
- - - - [images]
src/
- scss/
- - vendor.scss
- index.html
dist/
- css/
- - vendor.css
- img/
- - [images from imported css]
- index.html
webpack.cofing.js
const path = require('path');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const HtmlWebPackPlugin = require("html-webpack-plugin");
module.exports = {
mode: 'development',
entry: {
'vendor': [
'./src/js/vendor.js',
'./src/scss/vendor.scss'
],
'fa': './src/js/fa.js',
'sanAndreas': [
'./src/js/sa.js',
'./src/scss/sa.scss'
]
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'js/[name].js',
sourceMapFilename: '[file].map'
},
module: {
rules: [{
test: /\.js$/,
include: path.resolve(__dirname, 'src/js'),
use: {
loader: 'babel-loader',
options: {
presets: 'env'
}
}
},
{
test: /\.(png|jpg|gif|svg)$/,
use: [
{
loader: 'file-loader',
options: {name: 'img/[name].[ext]'}
},
]
},
{
test: /\.(sass|scss)$/,
include: path.resolve(__dirname, 'src/scss'),
use: ExtractTextPlugin.extract({
use: [{
loader: "css-loader",
options: {
sourceMap: true,
minimize: true
}
},
{
loader: 'resolve-url-loader'
},
{
loader: "sass-loader",
options: {
sourceMap: true
}
},
]
})
},
{
test: /\.html$/,
use: [
{
loader: "html-loader",
options: { minimize: true }
}
]
},
]
},
devtool: "source-map",
plugins: [
new CleanWebpackPlugin(['dist']),
new ExtractTextPlugin({
filename: './css/[name].css',
allChunks: true
}),
new HtmlWebPackPlugin({
template: "./src/index.html",
filename: "./index.html",
inject: false
}),
new HtmlWebPackPlugin({
template: "./src/sa.html",
filename: "./sa.html",
chunks: ['vendor', 'sanAndreas', 'fa']
}),
new HtmlWebPackPlugin({
template: "./src/five.html",
filename: "./five.html",
chunks: []
})
]
}