Question

我正在寻找一种将多个Post-CSS（或任何meta-CSS）文件分别编译为并行CSS文件的方法。

来自

resource/
 - a.pcss
 - b.pcss
 - c.pcss

到

output/
 - a.css
 - b.css
 - c.css

实际上，我们有200多个文件。因此，我必须将名称未知的文件夹中的每个文件编译为并行CSS文件。

直到Webpack3，wildcards-entry-webpack-plugin一直在帮助我们。但是遗憾的是它不支持Webpack4。

已经存在以下情况的答案，但我无法将其应用于我们的情况。

多个已知入口点×一个输出 https://github.com/webpack/docs/wiki/multiple-entry-points
多个未知入口点×一个输出 https://stackoverflow.com/a/34545812/10383041

这是我们当前使用Webpack3和wildcards-entry-webpack-plugin的配置

{
    context: path.join(__dirname, '/resource/css/page'),
    entry: WildcardsEntryWebpackPlugin.entry(`${__dirname}/resource/css/page/**/main.pcss`),
    output: {
        path: path.join(__dirname, '/public/css/page'),
        filename: '[name].js',
    },
    module: {
        rules: [
            {
                test: /\.(css|pcss)$/,
                use: ExtractTextPlugin.extract({
                    use: cssLoaders,
                }),
            },
        ],
    },
    plugins: [
        new ExtractTextPlugin({
            filename: '[name].css',
            allChunks: true,
        }),
        new WildcardsEntryWebpackPlugin(),
    ],
    stats,
},

Webpack4：多个未知入口点+多个输出

0 个答案: