Webpack Chunks在单独的文件夹中

Question

我想在我的应用中实现代码分割功能。我通过路线和用户require.ensure导入组件的每条路线拆分我的应用程序。我尝试将所有块放在chunk文件夹中，因此我在配置文件中更改输出：

output: {
   filename: "chunks/bundle[name].js"
}

但我收到404错误。

  

错误：加载块2失败了   HTMLScriptElement.onScriptComplete

所以我将它留在我有捆绑文件的文件夹中：

var webpack = require("webpack");
module.exports = {
    entry: "./js/app.js",
    output: {
        filename: "./bundle.js"
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: "vue-loader"
            },
            {
                test: /\.js$/,
                loader:"babel-loader"                
            },
            {
                test: /\.css$/,
                loader: "style-loader!css-loader"
            },
            {
                test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
                loader: "file-loader?name=element-ui/[name].[ext]"
            }       
        ]
    },
    resolve: {
        extensions: [ ".json", ".js", ".vue", ".css" ]
    },
    watch: true
};

现在有效，但我得到了像这样的块结构：folder chunk structure。如何在一个文件夹中移动所有块。这是使用代码分割功能的正确方法。

我想我错过了什么。 请帮忙！