Not working with style-loader

[igor-ribeiro]

I'm using style-loader and it generates multiple <style> tags. I have 2 files:

/* theme.css */
:root {
  --text-color: red;
}

/* App.css */
.App {
  color: var(--text-color);
}

The cssnext removes the theme.css tag and doesn't apply the variable value.

With cssnext:

Without cssnext:

It warns: ./src/App.css (Emitted value instead of an instance of Error) postcss-custom-properties. variable '--text-color' is undefined and used without a fallback

[MoOx]

You are probably doing multiples import in differents files, so different context. Keep in mind that CSS is transformed into string and must run in the same context to do something.
You may need to use postcss-import.