CODEWITHSUNDEEP
csssass
Joshua Muheim
Joshua Muheim

Reputation: 13195

Sass: Why can't I have a comment after an @import (on the same line)?

@import "foo" // Bar

...results in Invalid CSS after ""foo" ": expected media query list, was "// Bar". Why?

Thanks for explanation.

Upvotes: 2

Views: 768

Answers (2)

JA9
JA9

Reputation: 1778

you can try

@import "foo"; // Bar

actually you are missing semi-colon after your variable declaration.

Upvotes: -2

nikoshr
nikoshr

Reputation: 33344

  1. The CSS spec defines the @import rule as 

    <import-rule> = @import [ <url> | <string> ] <media-query-list>? ;

    which means @import followed by a string or a url followed by an optional list of media types

  2. In Sass syntax, comments must be on their own line

    Like everything else in the indented syntax, comments are line-based. This means that they don’t work the same way as in SCSS. They must take up an entire line, and they also encompass all text nested beneath them.

The parser expects a list of media types, finds a comment mixed with content and chokes on it.

You will have to split the comment and the content in Sass syntax:

 // Bar
 @import "foo"

Upvotes: 4

Related Questions