Using @value in composes failing #83

Activity

1. josephrexme commented on Mar 27, 2017

   

   josephrexme

   on Mar 27, 2017

   Last edited by josephrexme

   More actions

   I have the exact same issue. I had to compose directly from the path:

   .myclass{
     composes: smallText from './';
   }

   and in the case of inheriting the variable name

   @value myColor from './theme.css';
   .myclass{
     background: myColor;
   }
2. tivac commented on Mar 27, 2017

   

   tivac

   on Mar 27, 2017

   More actions

   I ran into this with modular-css and had to fix it by splitting up value-processing into a two-pass thing, where it does local values (like @value foo: "./foo.css";) first and then processing values/compositions imported from other files.

   Kinda of a PITA, but it worked out ok.
3. DavideDaniel commented on Apr 12, 2017

   

   DavideDaniel

   on Apr 12, 2017

   Last edited by DavideDaniel

   More actions

   yep, same...

   /* colors.css */
   @value primary: rgba(255,215,237,1);
   .primaryColor {
     color: primary;
     fill: primary;
   }

   then:

   /* styles.css */
   @value colors: "../colors.css";
   @value primary, secondary from colors;
   /* the following works */
   .header {
     background-color: primary;
   }
   /* the following results in error */
   .header {
     composes: primaryColor from colors;
   }

   Error message:
   "Module build failed: referenced class name "primaryClass" in composes not found"

   EDIT:
   I think what's happening is related to the things discussed in Evaneos/vitaminjs#261 - I realized I was getting values feature from simply using css-modules and not even using a post-css loader. After adding postcss correctly, it still gave me the error until I tried this:

   Solution:

   @value primary, secondary from "../colors.css";
   
   .header {
     composes: primaryColor from "../colors.css";
     background-color: secondary;
   }
4. TrySound

   added

   type: bug

   on May 23, 2017