css-modules / postcss-icss-values

Pass arbitrary constants between your module files
MIT License
203 stars 18 forks source link

Importing values results in export #79

Open okonet opened 7 years ago

okonet commented 7 years ago

Having variables in the separate file

/* variables.css */
@value mobile: 480px;
@value tablet: 768px;
@value desktop: 960px;
@value display: 1200px;

and when importing like this:

/* myfile.css */
@value mobile, display from "../variables.css";

.root {
...
}

and then

import styles from '.myfile.css';
console.log(styles);

I see that styles now contain imported variables.

{
  root: "some_hash",
  mobile: "480px",
  display: "1200px"
}

I'm not sure if this is expected behavior but I'd expect this behavior only from variables.css.

joeybaker commented 7 years ago

Is there a reason you'd not want this? It seems to me that since you've imported the values into your CSS file, you might want them in the JS file too, no?

okonet commented 7 years ago

The only reason is that there is no difference between my class names and variables in this object.

I'm doing some dynamic classNames matching depending on my props and was seeing that my elements got additional classNames (mobile and display). This could probably be fixed in the matching function but I was wondering if this is how it suppose to work.