Viijay-Kr / react-ts-css

VS Code Extension for CSS modules in typescript based react projects
https://marketplace.visualstudio.com/items?itemName=viijay-kr.react-ts-css
MIT License
37 stars 4 forks source link

Missing support for `.parent { &__child {...} }` #115

Closed JohanMouchet closed 5 months ago

JohanMouchet commented 7 months ago

The extension isn't able to resolve SCSS selectors composed with suffix selectors starting with &__, which is commonly used by BEM.

To Reproduce

  1. Create a SCSS Modules file: styles.module.scss
  2. Write the following selector
    .parent {
    &__child {
    color: blue;  
    }
    }
  3. Import the SCSS Modules file in a React file: import styles from "./styles.module.scss";
  4. Add the selector to an element
    <div className={styles["parent__child"]} />

Expected behavior The extension shows

Selector 'parent__child' does not exist in "./styles.module.scss"

Desktop (please complete the following information):

Additional context Is it a matter of adding a parser in the utils?

This is a great extension, keep up the great work ✌️

Viijay-Kr commented 7 months ago

@JohanMouchet Thanks for opening up this issue. Yes it is indeed a matter of tweaking the isSuffix regex matcher .

Feel free to open a PR if you can.

And thanks for your feedback . If you like the extension feedback in marketplace would go a long way :)

fundevstuff commented 6 months ago

@Viijay-Kr I added a PR for this that seems to be working for me.

Thanks for a great extension!

Viijay-Kr commented 5 months ago

@JohanMouchet This is fixed by #117. If this is solved for you Please feel free to close this one. Thanks