less背景图片加载不出来

//main.less
body,html{
    margin:0;
    height:100%;
}
.box{
    height:100%;
    background:url(../image/bg.png);
}

//webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin')
const path = require('path');

module.exports = {
    mode:'development',
    entry:'./src/index.js',
    output:{
        path:path.resolve(__dirname,'dist'),
        filename:'bundle.js'
    },
    module:{
        rules:[
            {
                test:/\.less$/,
                use:[
                    'style-loader',
                    {loader:'css-loader',options:{importLoaders:1}},
                    'less-loader'
                ]
            },
            {
                test:/\.(png|jpg?g|gif)$/,  
                loader:'url-loader',
                options: {
                    esModule: false,
                    outputPath:'dist'
                 }
            }
        ]
    },
    plugins:[new HtmlWebpackPlugin({ //打包输出html
        title:'app',
        minify:{
            removeComments:true, // 移除html中注释
            collapseWhitespace:true,//删除空白符与换行符
            minifyCSS:true  //压缩内联css
        },
        filename:'index.html',
        template:'index.html'
    })]
}

路径可能有问题，尝试一下绝对路径

你的box有高度吗