@import or @require for shared Stylus partials when duplicate output is a concern
21.5K reputation · 09 Oct 2023, 22:25 UTC
In a Stylus codebase with many partials that all depend on a shared library of mixins and variables, I need to pick a consistent inclusion strategy. Stylus documents two directives: @import inlines the target file on every reference, while @require includes a given file only once per compilation.
The concrete constraint is stylesheet size: the shared file is referenced from dozens of component partials, so I want to avoid duplicated CSS in the compiled output. @require seems like the obvious default, but I am unsure about the edge cases that affect the decision.
Specifically, the documentation and community notes suggest that @require deduplication is keyed on the resolved file path, which raises questions about symlinked or differently-pathed references to the same file. I also understand that mixing @import and @require on the same file can silently produce duplicates, since @import does not respect the already-loaded tracking.
My questions:
- Is
@requiresafe to rely on as the sole deduplication mechanism when some partials are reached through symlinks or relative paths that resolve differently? - When a file genuinely needs per-call-site re-evaluation (e.g. a mixin that emits context-dependent rules), is there a documented pattern for combining it with
@require-managed dependencies without double output? - Does deduplication behave predictably with glob patterns like
@require 'components/*', or does ordering become ambiguous?
Assume a recent Stylus version compiled via the Node.js API; I can verify behavior with a small two-partial test project if needed.
0 answers
A thoughtful contribution can make all the difference. Be the first to share one.
0 question comments
Use comments to ask for clarification. Post a solution as an answer.
No question comments on this page.