Webpack解决src文件夹中的所有文件

Question

我没有太多使用webpack，所以我不确定这可能是一个简单或复杂的问题。

历史

过去，我的团队一直在使用一种简单而强大的方法来将src文件夹结构与我们所有的文件压平到一个文件夹中，以解决JS和HTML模板导入问题。 一旦我们以文件夹结构是针对人类的事实为条件的，这才有意义。

好处是我们可以一次更改整个文件夹结构，而无需更改任何代码。 因此，我们可以使事情尽可能平整，直到有道理为止，而当需要将事情分解时，我们只需要做，而无需更改任何代码。

我们如何做到的

我们使用Gulp和gulp-flatten提取了此方法，并确保所有文件都具有冗长且唯一的名称，然后从输出中解析文件。 它对我们非常有用。

问题

我们正在尝试使用Webpack复制相同的模式，但我们无法弄清楚。 我们一直在研究别名，但尚未找到能使src目录中的所有文件变平或仅解析的文件。

Answer 1

如果您只想复制所有文件并像gulp- flatten一样将它们展平，则可以将copy-webpack-plugin与flatten选项一起使用。

[
    new CopyWebpackPlugin([
        { from: 'src/**/*', to: 'dest/', flatten: true }
    ], options)
]

但这无法解决文件中的任何内容。
您还可以将每个文件定义为webpack的入口点，这也将使它们变平并使用常规加载程序。

const glob = require('glob');

module.exports = () => {

    return {
        mode: 'development',
        entry: () => {
            return glob.sync('./src/*.js').reduce((pre, cur) => {
                pre[cur.replace(/^.*[\\\/]/, '').split('.')[0]] = cur;
                return pre;
            }, {});
        },
        output: {
            path: __dirname + '/dist',
            filename: '[name].js',
        },
    };
};