Vision

"webpack": "^3.10.0",
"webpack-dev-server": "^2.9.5"

File structure (before packing):

webpack.config.js

const path = require("path");
const webpack = require("webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");


var getHtmlConfig = function (name, title) {
    return {
        template: "./demos/" + name + ".html",
        filename: "demos/" + name + ".html",
        title: title,
        inject: true | "body",
        hash: true,
        cache: true,
        chunks: ["common", name]
    };
};


module.exports = {
    entry: {
        "common" : "./js/common.js",
        "a"   : "./js/a.js",
    },

    devServer: {
        host: "0.0.0.0",
        useLocalIp: true,
        contentBase: path.resolve(__dirname, "dist"),
        compress: true,
        port: 9000,
        open: true
    },

    //   
    module: {
        loaders: [{
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader"
            }, 
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: ["css-loader", "px2rem-loader?remUnit=23.438&remPrecision=8", "postcss-loader"],
                })
            },
            {
                test: /\.scss$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: ["css-loader", "px2rem-loader?remUnit=46.875&remPrecision=8", "sass-loader", "postcss-loader"]
                })
            },
            {
                test: /\.(png|jpg|gif|jpeg)$/,
                loader: "url-loader",
                options: {
                    limit: 2048,
                    name: "images/[name].[ext]"
                }
            },
            {
                test: /\.(eot|svg|ttf|woff|woff2|otf)$/,
                loader: "url-loader",
                options: {
                    limit: 8192,
                    name: "fonts/[name].[ext]"
                }
            }
        ]
    },

    externals: {
        jquery: "window.jQuery"
    },

    // 
    plugins: [
        new HtmlWebpackPlugin(getHtmlConfig("a", "ab")),
        new ExtractTextPlugin("css/[name].min.css")
    ],

    //   
    output: {
        path: path.resolve(__dirname, "dist"),
        filename: "js/[name].min.js",
    }
};

question: the picture is introduced into the html file through the img tag, and the images folder does not appear under the dist folder after packaging?