Redundant style duplication

[treecoder]

In webpack.config.js we have something like this:

sassLoader: {
    data: '@import "theme/_config.scss";',
    includePaths: [path.resolve(__dirname, './src/app')]
  },

The data directive here appends any styles in _config.scss in EVERY css file it processes. Additionally, if _config.scss @imports any other styles, they are also appended. This is how css-loader works -- and there is no way around it.

Please have a look at this issue:
webpack-contrib/css-loader#17

Is there a solution for this?

[javivelasco]

Hi @treecoder

The next version of react-toolbox will get rid of sass in favor of postcss so this configuration will no longer be needed. Meanwhile I think it should be possible to write two different loader configurations for webpack. One looking for react-toolbox assets and another for your custom. Then I'm quite sure you can reference the sassLoader configuration injecting the variables only for react toolbox stylesheets.

[treecoder]

Yep. That's right.
Postcss would be definitely a better option.

Good to have react-toolbox/react-toolbox#666.

For now closing this.

[javivelasco]

Great!