获取 webpack 入口点名称并在 loader 中重用它

Question

我正在尝试根据入口点将一些数据传递给 SCSS。我将有两个主题，我必须知道我当前捆绑的主题是什么。

Webpack 入口点：

webpack: {
    entry: {
        toyota: path.resolve(__dirname, '../entries/theme.toyota.js'),
        lexus: path.resolve(__dirname, '../entries/theme.lexus.js'),
    },

然后，我想识别入口点，并将其作为变量传递给 SCSS：

  test: /\.s?css$/,
    exclude: /node_modules/,
    use: [{
            loader: 'sass-loader',
            options: {
                data: '$brand: "' + entryPointName +'";',
                sourceMap: true
            }
        },
    ]

我已经尝试过[name]但没有运气......

我可以通过使用不同的 ENV 变量再次运行构建来实现这一目标，但我希望通过一项任务来实现这一目标（以便使用手表加快构建时间）。

有什么办法可以实现这一点吗？

Answer 1

最后，解决方案是 webpack 层......

webpack: {
    entry: {
        toyota: { import: path.resolve(__dirname, '../entries/theme.toyota.js'), layer: 'toyota' },
        lexus: { import: path.resolve(__dirname, '../entries/theme.lexus.js'), layer: 'lexus' },
    },
    experiments: {
        layers: true,
    },

test: /\.s?css$/,
exclude: /node_modules/,
oneOf: [
    {
        issuerLayer: 'toyota',
        use: [{
                loader: 'sass-loader',
                options: {
                    data: '$brand: "toyota";',
                    sourceMap: true
                }
            },
        ]
    },
    {
        issuerLayer: 'lexus',
        use: [{
                loader: 'sass-loader',
                options: {
                    data: '$brand: "lexus";',
                    sourceMap: true
                }
            },
        ]
    },
]