Compile function gets stuck if @import is used inside a media query

[sebastianwebb]

Is there some way to debug the progress of the compile function? By enabling browser console logging or something?

I've run into an issue where the compile function gets stuck with the following invalid Sass:

@media (max-width: 600px) {

@import "scripts/test.scss";

The initial error message is

media query expression must begin with '('.

But then subsequent compile attempts (to fix the invalid code) never return anything more. It seems the compile callback function just doesn't run.

I hope you can replicate this issue and offer any advice. The contents of test.scss is:

div.test {
  color: blue;
}

Thanks for your time.
Sebastian

[rodneyrehm]

Hey there!

Can you provide a test case for me to run and see where things go wrong?

Is the content of @import "scripts/test.scss"; irrelevant, and this fails as soon as you try to compile @media (max-width: 600px) { @import "dummy.scss"; }?

[sebastianwebb]

Hey, thanks for getting back to me. I don't think it matters what the content of test.scss is. I initially encountered this with bootstrap, but then was able to replicate it by loading a simple file with the following content:

div.test {
  color: blue;
}

The key to triggering it seems to be a valid path to an import file inside the curly brackets of a media query.

Let me know if you need anything else from me.

Cheers!

[sebastianwebb]

Hey, were you able to replicate this issue? Just wanted to make sure it isn't an issue specific to my implementation.

Thanks!