TypeError: Cannot set properties of null (setting '...'), when using markAsUsed comments #93

Activity

1. yuhsianw commented on Oct 30, 2023

   

   yuhsianw

   on Oct 30, 2023

   Last edited by yuhsianw

   Collaborator

   More actions

   Hi @tiwariav , thanks for reporting this. Can you please provide the reproduce steps for the issue following this example:

   Repro Code

   import s from './animationName.scss';
   
   export default Foo = () => (
     <div>
       <div className={s.someAnimation}></div>
     </div>
   );

   @keyframes someAnimation {}

   ESLint Config

   {
     "plugins": ["css-modules"],
     "extends": ["plugin:css-modules/recommended"]
   }

   Expected Result

   Expected no errors

   Actual Result

   Received error:

   Class or exported property 'someAnimation' not found
   
2. yuhsianw commented on Nov 1, 2023

   

   yuhsianw

   on Nov 1, 2023

   Collaborator

   More actions

   Template for above:

   ### Repro Code
   ```javascript
   import s from './animationName.scss';
   
   export default Foo = () => (
     <div>
       <div className={s.someAnimation}></div>
     </div>
   );
   ```
   ```css
   @keyframes someAnimation {}
   ```
   
   ### ESLint Config
   ```json
   {
     "plugins": ["css-modules"],
     "extends": ["plugin:css-modules/recommended"]
   }
   ```
   
   ### Expected Result
   Expected no errors
   
   ### Actual Result
   Received error:
   ```
   Class or exported property 'someAnimation' not found
   ```
3. tiwariav commented on Nov 1, 2023

   

   tiwariav

   on Nov 1, 2023

   Last edited by tiwariav

   Author

   More actions

   Repro Code

   /* eslint css-modules/no-unused-class: [2, {camelCase: true, markAsUsed:
     ['nested']
   }] */
   import styles from './styles.scss';
   
   export default Foo = () => (
     <div className={styles.root}>
       <div className={styles.nested}></div>
     </div>
   );

   .root {
     color: green;
     & .nested {
       color: red;
     }
   }

   ESLint Config

   {
     "plugins": ["css-modules"],
     "rules": {
       "css-modules/no-undef-class": ["warn", { "camelCase": true }],
       "css-modules/no-unused-class": ["error", { "camelCase": true }],
     }
   }

   Expected Result

   Expected no errors

   Actual Result

   Received error:

   TypeError: Cannot set properties of null (setting 'nested')
   

   Can check here as well.
   https://codesandbox.io/p/sandbox/brave-mopsa-ycnv8f?file=%2Fsrc%2Findex.tsx%3A6%2C1
4. tiwariav commented on Nov 1, 2023

   

   tiwariav

   on Nov 1, 2023

   Author

   More actions

   From what I have tried, its only giving error if using nested classes. Although the same works fine with previous version.
5. alex-e-leon

   added 2 commits that reference this issue on Jan 16, 2025

   pin css modules

   ...

   effa015

   pin css modules

   ...

   372c2ea