@import not detected in .scss files

[KutnerUri]

quite odd, but @imports are not being detected.
I am seeing at least two resolved issues about this, so I can't explain why it's happening now.

this is my code:

@import '~@bit/bit.gui.sizes';
@import '../styles.scss'

...

I added this file using:
bit add styles.scss --id catplant

Status is "ok" , even though ../styles.scss and ~@bit/bit.gui.sizes are missing:

❯ bit s            
new components
(use "bit tag --all [version]" to lock a version with all your changes)

     > catplant ... ok

and no dependencies are detected:

❯ bit show catplant
Id               │ catplant                                    
─────────────────┼─────────────────────────────────────────────
Language         │ javascript                                  
─────────────────┼─────────────────────────────────────────────
Main File        │ src/routes/UserProfile/UserNav/styles.scss  
─────────────────┼─────────────────────────────────────────────
Dependencies     │                                             
─────────────────┼─────────────────────────────────────────────
Dev Dependencies │                                             
─────────────────┼─────────────────────────────────────────────
Files            │ src/routes/UserProfile/UserNav/styles.scss  

the bug is not very consistent. Some things are detected:

@import '~theme/sizes';

generates this status:

     > catplant ...  issues found       
       missing packages dependencies (use your package manager to make sure all package dependencies are installed): 
          src/routes/UserProfile/UserNav/styles.scss -> ~theme, ~theme, ~theme`

any ideas why this is happening, and how to solve it?

Specifications:

• Bit version: 14.2.4
• Node version: 12.1.0
• yarn version: 1.16.0
• Platform: macOS 10.14.6

[GiladShoham]

Also when changing from .scss to sass it is working

[devth]

I tried switching from .scss to .sass but it didn't seem to fix, although it detects the dependency:

bit show git-hub-org-cards
╔══════════════════╤════════════════════════════════════════════════════╗
║ Id               │ [email protected]                            ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Compiler         │ bit.envs/compilers/[email protected]                     ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Language         │ javascript                                         ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Main File        │ src/components/GitHubOrgCards/index.js             ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Dependencies     │ [email protected]                                     ║
║                  │ [email protected]                                  ║
║                  │ react@^16.10.2                                     ║
║                  │ bulma@^0.7.5                                       ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Dev Dependencies │                                                    ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Files            │ src/components/GitHubOrgCards/index.js             ║
║                  │ src/components/GitHubOrgCards/styles.sass          ║
║                  │ src/components/GitHubOrgCards/test.js              ║
╚══════════════════╧════════════════════════════════════════════════════╝

bit tag --all $version
error: issues found with the following component dependencies

devth.github/[email protected]
missing packages dependencies (use your package manager to make sure all p
ackage dependencies are installed):
     src/components/GitHubOrgCards/styles.sass -> ~bulma

bulma is in my pacakge.json so I don't know why it's complaining.

[GiladShoham]

@devth Can you please paste here your import statement in the styles.sass file?
@davidfirst let's check it

[devth]

Yep.

@import "~bulma/sass/utilities/_all.sass";
@import "~bulma/sass/base/_all.sass";
@import "~bulma/sass/grid/columns.sass";
@import "~bulma/sass/elements/notification.sass";
@import "~bulma/sass/elements/content.sass";
@import "~bulma/sass/elements/image.sass";
@import "~bulma/sass/elements/title.sass";
@import "~bulma/sass/components/card.sass";

[davidfirst]

@GiladShoham , I have a feeling that something else is missing and it shows ~bulma by mistake. (similar to this issue #2033). As you can see, in bit show it does show Bulma.

@devth , Did you add 'resolveModules` configuration into your workspace config? if so, could you copied it here?

[devth]

Nope, I don't have resolveModules config. Should I?

[davidfirst]

@devth , nope. I was just thinking that this resolveModules feature caused the issue.
I'd like to try reproducing the issue. If you can add me as a collaborator to the component or send me the files it'd be great. [email protected].
When I create a new file and add all the import statements above, I don't see any issue.

➜  wp cat aaa.sass
@import "~bulma/sass/utilities/_all.sass";
@import "~bulma/sass/base/_all.sass";
@import "~bulma/sass/grid/columns.sass";
@import "~bulma/sass/elements/notification.sass";
@import "~bulma/sass/elements/content.sass";
@import "~bulma/sass/elements/image.sass";
@import "~bulma/sass/elements/title.sass";
@import "~bulma/sass/components/card.sass";%                                                                                                                                                                ➜  wp bit show aaa
╔══════════════════╤════════════════════════════════════════════════════╗
║ Id               │ aaa                                                ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Language         │ javascript                                         ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Main File        │ aaa.sass                                           ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Dependencies     │ bulma@^0.7.5                                       ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Dev Dependencies │                                                    ║
╟──────────────────┼────────────────────────────────────────────────────╢
║ Files            │ aaa.sass                                           ║
╚══════════════════╧════════════════════════════════════════════════════╝

No documentation found
➜  wp bit status
new components
(use "bit tag --all [version]" to lock a version with all your changes)

     > aaa ... ok
➜  wp

[devth]

@davidfirst added you as collab on the repo and component. Working on migrate-to-cra branch:
https://github.com/devth/github-org-cards/tree/migrate-to-cra

bulma is now listed as a dependency and is not cuasing errors when trying to build/tag since I reverted from just importing compiled css to the scss. Not sure why. There's a separate issue (diff React versions, I think) preventing rendering the component in bit: https://bit.dev/devth/github/git-hub-org-cards

Feel free to add commits or whatever. Thanks!

[davidfirst]

@devth , thanks for adding me as a collaborator. I was able to clone the project, switch to migrate-to-cra branch, but not sure how to reproduce the error.
I copied the import statements to src/components/GitHubOrgCards/bulma.css file, and also tried to rename it to .sass, but still no error. Am I missing something?

[devth]

Nope you’re not missing anything. I can’t reproduce now either. But I tried a bunch of different stuff between originally reproducing and the current state so somehow along the way it got fixed. I can try repoing again.

…

On Oct 16, 2019, at 12:37 PM, David First ***@***.***> wrote:  @devth , thanks for adding me as a collaborator. I was able to clone the project, switch to migrate-to-cra branch, but not sure how to reproduce the error. I copied the import statements to src/components/GitHubOrgCards/bulma.css file, and also tried to rename it to .sass, but still no error. Am I missing something? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

[davidfirst]

Oh ok, I got it. If you happen to reproduce the issue, I'd be glad to take a look at it.

[KutnerUri]

I believe this is fixed? Doesn't happen anymore.