Postcss-simple-vars is not working properly

Question

I've been at this problem fro quite some time and can't seem to find a solution. Any help would be greatly appreciated. I have created _variables.css file which hold all my CSS variables. I use one of the variables in _global.css on the body tag. However, the styling isn't applied. I have attached screenshots. Thank you. _variables.css . _global.css . styles.css error message

Answer 1

You are using css preprocessors variables so you have to change file extensions to be .scss , also you need to compile your .scss files to .css , check this guide

or you can use css variables with different syntax, just like that

:root {
  --main-bg-color: coral;
}

#div1 {
  background-color: var(--main-bg-color);
}