Question

如何在webpack中设置多个输入路径时在路径中使用正则表达式？

webpack.config.js

./javascripts/plugins/Alpha/plugin.js
./javascripts/plugins/Beta/plugin.js
./javascripts/plugins/Charlie/plugin.js
./javascripts/plugins/Delta/plugin.js
...

我想这样输出？

./build/resources/plugins/Alpha/Create/plugin.js
./build/resources/plugins/Beta/plugin.js
./build/resources/plugins/Charlie/plugin.js
./build/resources/plugins/Delta/plugin.js
...

我可以通过以下配置

来实现这一点

{
entry: {
    "Alpha": "./resources/plugins/Alpha/plugin",
    "Beta": "./resources/plugins/Beta/plugin",
    "Charlie": "./resources/plugins/Charlie/plugin",
    "Delta": "./resources/plugins/Delta/plugin"
},
output: {
    filename: "[name]/plugin.js",
    path: "./build/resources/plugins"
},
module: {
    loaders: [
        {test: /\.js$/, loaders: ["babel-loader"]}
    ]
}

}

但是有一个问题，即使我的目录结构相同，如果我添加一个新的插件，我将不得不在entry键中创建一个新条目。这样我的webpack.config.js将继续增长。我可以在输入和输出目录中看到一个模式

输入：./javascripts/plugins/[pluginName]/plugin.js

输出：./build/resources/plugins/[pluginName]/plugin.js

有没有什么方法可以通过在路径中编写任何正则表达式来实现相同的目的？

Answer 1

您可以使用fs扫描目录并动态创建条目对象。我就是做这个的。（我假设你现在正在使用节点。）

const fs = require('fs');
const entryMap = {};

fs.readdirSync('./src/app/pages/')
    .filter(file => {
        return file.match(/.*\.js$/);
    })
    .forEach(f => {
        entryMap[f.replace(/\.js$/, '')] = ['./pages/' + f];
    });

进入路径中的正则表达式，同时在webpack中创建多个入口点

1 个答案: