Skip to main content

no-invalid-position-at-import-rule

Disallow invalid position @import rules within a stylesheet.

a {}
@import 'foo.css';
/** ↑
* This @import */

Any @import rules must precede all other valid at-rules and style rules in a stylesheet (ignoring @charset and @layer), or else the @import rule is invalid.

Options

true

The following patterns are considered problems:

a {}
@import 'foo.css';
@media print {}
@import 'foo.css';

The following patterns are not considered problems:

@import 'foo.css';
a {}
/* some comment */
@import 'foo.css';
@charset 'utf-8';
@import 'foo.css';
@layer default;
@import url(theme.css) layer(theme);

Optional secondary options

ignoreAtRules: ["/regex/", /regex/, "string"]

Given:

["/^--my-/", "--custom"]

The following patterns are not considered problems:

@--my-at-rule "bar.css";
@import "foo.css";
@--my-other-at-rule {}
@import "foo.css";
@--custom "bar.css";
@import "foo.css"