请问为什么webpack打包之后项目根目录下会出现0..，1..，2..的文件夹，有什么作用

Question

var htmlWebpackPlugin = require('html-webpack-plugin');
var path = require('path');
var webpack = require('webpack');
// var webpackMerge = require('webpack-merge');

module.exports = {
    entry: './src/main.js',
    output:{
        filename:'./dist/bundle-[hash].js'
    },
    module: {
        loaders: [
            {
                test: /\.css$/,
                loaders: ["style-loader", "css-loader"],
            },
            {
                test: /\.js$/,
                loader: "babel-loader",
                // include: '/src/static/views/'
            },
            {
                test: /\.html$/,
                loader: "html-loader"
            },
            {
                test: /\.(png|jpg)$/,
                loader: 'url-loader'
            }
        ]
    },
    plugins: [
        new webpack.ProvidePlugin({
            _ : 'underscore',
            $ : 'webpack-zepto',
            Zepto : 'webpack-zepto',
            'window.Zepto': 'webpack-zepto',
            'window.$': 'webpack-zepto',
            fastclick : 'fastclick'
        })
    ],
    externals: {
        zepto: 'window.$'
    }
};

Answer 1

The reason you are seeing this is because the output.filename property is supposed to only contain the name of the file itself.

What is happening is that webpack is assuming the folder path before it, and then using the [hash] id of the lazy loaded bundles you are creating as the folder names.

My best guess would be that you could instead change this to:

const path = require('path');

module.exports = {
    // ...
    output: {
        path: path.join(__dirname, "dist"),
        filename: "bundle-[hash].js"
    }
    // ...
};

Answer 2

上代码会更清楚