useQwikValidLexicalScope

Ce contenu n’est pas encore disponible dans votre langue.

JSX and TSX

Summary

Rule available since: v2.2.6
Diagnostic Category: lint/nursery/useQwikValidLexicalScope
This rule doesn’t have a fix.
The default severity of this rule is error.
This rule belongs to the following domains:
- qwik
Sources:
- Same as qwik/valid-lexical-scope

How to configure

1
{
2
  "linter": {
3
    "rules": {
4
      "nursery": {
5
        "useQwikValidLexicalScope": "error"
6
      }
7
    }
8
  }
9
}

Description

Disallow unserializable expressions in Qwik dollar ($) scopes.

Ensures all captured values in Qwik components can be properly serialized for resumability. See Qwik Optimizer: Lexical Scope for proper usage patterns.

Examples

Invalid

1
// Arrow function assigned without wrapping it in $(...)
2
const handleClick = () => {
3
  console.log("clicked");
4
};

code-block.js:2:21 lint/nursery/useQwikValidLexicalScope ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ✖ Non-serializable expression must be wrapped with $(…)
  
    1 │ // Arrow function assigned without wrapping it in $(…)
  > 2 │ const handleClick = () => {
      │                     ^^^^^^^
  > 3 │   console.log(“clicked”);
  > 4 │ };
      │ ^
    5 │ 
  
  ℹ Qwik requires serializable closures for:
    - Resumability (pausing/resuming execution)
    - Code splitting (lazy loading components)
    - Optimized rehydration (client-side continuation)
  
  ℹ Wrap the expression with $(…) to make it serializable. Learn more: Qwik documentation.

Valid

1
const handleClick = $(() => {
2
  // Valid: only using serializable variables or props
3
  console.log("clicked");
4
});