Import

.luis files can include other .luis or CSS files via @import.

---

Syntax

@import "./base.luis";
@import "./vendor.css";
@import url("./theme.css") screen;

---

Difference Between .luis and CSS Imports

	.luis import	CSS import
Compile behavior	Resolved and inlined into the main source	Preserved as an @import declaration
Visible in output?	No — content is expanded	Yes — stays as @import

/* .luis import — content is expanded at compile time */
@import "./tokens.luis";

/* CSS import — carried to output as-is */
@import "./vendor.css";

---

Usage Anywhere in the File

@import does not need to be at the top of the file. It can appear after a selector block or at-rule.

--primary: #2060ff;

.btn { color: var(--primary); }

@import "./extra.luis";

.card { padding: 16px; }

---

Import Order

Some at-rules have ordering requirements:

• @charset must be the first declaration in the file — it comes before @layer, @import, and all other rules
• @layer declarations must come before .luis imports and regular rules

/* ✓ Correct order */
@charset "UTF-8";
@layer base, components;
@import "./tokens.luis";

.btn { color: red; }

/* ✗ Wrong — @charset cannot come after rules */
@import "./tokens.luis";
@charset "UTF-8";

/* ✗ Wrong — @layer cannot come after rules */
@import "./tokens.luis";
@layer base, components;

When the order rule is violated, an invalid-directive-order or invalid-directive-position warning is produced.

---

Import Cycle

If two .luis files import each other, an import-cycle warning is produced. A circular import does not stop compilation; the relevant import is skipped.

a.luis

@import "./b.luis";

/* b.luis */
@import "./a.luis";  /* → import-cycle warning */

---

Import Graph Limits (Defaults)

Limit	Default	Purpose
maxImportDepth	64	Limits nested import depth
maxImportCount	2,000	Limits the total number of resolved imports
maxImportedBytes	4,000,000	Limits the total size of imported sources

Detailed example:

app.luis

@import "./a.luis";
@import "./b.luis";

If the a.luis -> ... -> z.luis chain exceeds the depth or total byte limit:

1. In fail-soft mode the branch that exceeds the limit is cut at import resolution.
2. A resource-limit warning is produced.
3. Compilation continues with the other rules that are within the limit.

---

Warning Codes

Code	When Produced
import-not-found	Import could not be resolved
import-cycle	Two or more .luis files import each other
invalid-import-url	Unsupported or unsafe URL used (javascript:, etc.)
unsupported-import	Import format not supported by the compiler
duplicate-import-variable	The same variable was defined more than once from different imports
invalid-directive-order	Directives like @charset, @layer are in the wrong order
invalid-directive-position	A directive is used in a disallowed position