useQwikLoaderLocation (JavaScript)

Language JavaScript (and super languages)

Summary

Rule available since: v2.4.11
Diagnostic Category: lint/nursery/useQwikLoaderLocation
This rule doesn’t have a fix.
The default severity of this rule is warning.
This rule belongs to the following domains:
- qwik
Sources:
- Same as qwik/loader-location

How to configure

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

Description

Enforce that Qwik loader functions are declared in the correct location.

Route functions like routeLoader$, routeAction$ must be declared in route boundary files (index, layout, or plugin files inside the configured routes directory). All loader/action functions must also be exported from the module and follow the use* naming convention.

See the Qwik documentation for more details.

Examples

Invalid

1
// src/components/product.jsx
2
import { routeLoader$ } from '@builder.io/qwik-city';
3
export const useProducts = routeLoader$(async () => {});

/src/components/product.jsx:3:28 lint/nursery/useQwikLoaderLocation ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ⚠ The route function routeLoader$() has been declared outside of the route boundaries.
  
    1 │ // src/components/product.jsx
    2 │ import { routeLoader$ } from '@builder.io/qwik-city';
  > 3 │ export const useProducts = routeLoader$(async () => {});
      │                            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    4 │ 
  
  ℹ Route functions are typically declared within the route boundaries as they are tied to a specific route, if not, Qwik can't associate them with a route.
  
  ℹ Route boundary files are index, layout, and plugin files inside the "src/routes" directory.
  
  ℹ Move the file within the route boundaries or if you want to create reusable logic, you must re-export from within the router boundary.
    See the Qwik docs on re-exporting loaders for details.
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

1
// src/routes/index.jsx
2
import { routeLoader$ } from '@builder.io/qwik-city';
3
export const getProducts = routeLoader$(async () => {});

/src/routes/index.jsx:3:14 lint/nursery/useQwikLoaderLocation ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ⚠ The exported name of routeLoader$() must follow the use* naming convention.
  
    1 │ // src/routes/index.jsx
    2 │ import { routeLoader$ } from '@builder.io/qwik-city';
  > 3 │ export const getProducts = routeLoader$(async () => {});
      │              ^^^^^^^^^^^
    4 │ 
  
  ℹ Rename the declaration to start with "use".
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

1
// src/routes/index.jsx
2
import { routeLoader$ } from '@builder.io/qwik-city';
3
const useProducts = routeLoader$(async () => {});

/src/routes/index.jsx:3:7 lint/nursery/useQwikLoaderLocation ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ⚠ The loader function routeLoader$() is not being exported.
  
    1 │ // src/routes/index.jsx
    2 │ import { routeLoader$ } from '@builder.io/qwik-city';
  > 3 │ const useProducts = routeLoader$(async () => {});
      │       ^^^^^^^^^^^
    4 │ 
  
  ℹ A loader function must be exported, if not, the loader will not run. Make sure to export the loader.
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

1
// src/routes/index.jsx
2
import { routeLoader$ } from '@builder.io/qwik-city';
3
async function fetcher() {}
4
const useProducts = routeLoader$(fetcher);

/src/routes/index.jsx:4:7 lint/nursery/useQwikLoaderLocation ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

  ⚠ The loader function routeLoader$() is not being exported.
  
    2 │ import { routeLoader$ } from '@builder.io/qwik-city';
    3 │ async function fetcher() {}
  > 4 │ const useProducts = routeLoader$(fetcher);
      │       ^^^^^^^^^^^
    5 │ 
  
  ℹ A loader function must be exported, if not, the loader will not run. Make sure to export the loader.
  
  ℹ This rule belongs to the nursery group, which means it is not yet stable and may change in the future. Visit https://biomejs.dev/linter/#nursery for more information.

Valid

1
// src/routes/index.jsx
2
import { routeLoader$ } from '@builder.io/qwik-city';
3
export const useProducts = routeLoader$(async () => {});