@import must precede all other statements (besides @charset)

See original GitHub issue
@import "variables.css";
@import "fonts.css";
@import "base.css";

@copy full {
@import "typography.css";
}

@paste full;

@media screen and (max-width: 799px) {
    @ihamster {
        --font-size: 14px;
        --line-height: 1.25;
        --to-font-size: 18px;
        --to-line-height: 1.4;
        --viewport: 320px 800px;
        --unit: vw;
    }
    @ruler;
    @paste full;
    @hamster end;
}

@media screen and (min-width: 800px) and (max-width: 1919px){
    @ihamster {
        --font-size: 18px;
        --line-height: 1.4;
        --to-font-size: 21px;
        --to-line-height: 1.5;
        --viewport: 800px 1920px;
        --unit: vw;
    }
    @ruler;
    @paste full;
    @hamster end;
}
@media screen and (min-width: 1920px){
    @ihamster {
        --font-size: 21px;
        --line-height: 1.5;
        --to-font-size: 42px;
        --to-line-height: 1.6;
        --viewport: 1920px 3840px;
        --unit: vw;
    }
    @ruler;
    @paste full;
    @hamster end;
}

@import "icons.css";
@import "helpers.css";

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:7 (1 by maintainers)

github_iconTop GitHub Comments

8reactions
RyanZimcommented, May 17, 2017

I don’t see a bug here, the readme states:

This plugin attempts to follow the CSS @import spec; @import statements must precede all other statements (besides @charset).

Since your imports are not at the top, you’re going to get an error.

1reaction
h0tc0d3commented, May 17, 2017

Lol. Worked until the last update.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Warning: @import must precede all other statements (besides ...
I want to explain it through two screenshots that why it is giving warning. Because you are not using @import ....line at first...
Read more >
postcss-import: @charset must precede all other statements
Hi, just testing your createSurvey product using Angular 11. I found out a warning message coming from survey-creater.css file, ...
Read more >
[vite:css] @charset must precede all other statements - You.com
The @charset rule must be the first element in the style sheet and not be preceded by any character. If several @charset rules...
Read more >
postcss-import - npm
This plugin attempts to follow the CSS @import spec; @import statements must precede all other statements (besides @charset ).
Read more >
import - CSS: Cascading Style Sheets - MDN Web Docs
Imported rules must come before all other types of rules, except @charset rules and layer creating @layer statements. The @import rule is ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found