webpack-scss-sass-file does not work with conditional css extract

Question

I am using WEBPACKEXTRACT-PLUGIN to extract scss into css file.

Having trouble with conditional extract. At moment we have OLD-SCSS and NEW-SCSS so in my app.js file am doing like this.

if (somecondition) {
  require('path-to-old.scss');
} 
else {
  require('path-to-new.scss');
}

But the end result is coming combination of both OLD-SCSS and NEW-SCSS regardless of condition is true or false.

Is there any way to make it extract conditionally.

Answer 1

What is the context of this condition?

I would recommend you to not require this in your app.js but to put those files on webpack.config.js and conditionally change between them using node_env parameters, like this:

NODE_ENV="old" webpack

And on your webpack.config.js file:

const oldOrNew = process.env.NODE_ENV;

module.exports = {
    // ...
    entry: {
        css: (oldOrNew === 'old') ? 'path-to-old.scss' : 'path-to-new.scss'
    },
    // ...
}