Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[🐞] ESLint: invalidLoaderLocation should not be triggered if filename extension is JSX #6361

Closed
loriswit opened this issue May 22, 2024 · 2 comments · Fixed by #6374
Closed
Labels
STATUS-1: needs triage New issue which needs to be triaged TYPE: bug Something isn't working

Comments

@loriswit
Copy link
Contributor

Which component is affected?

Qwik Rollup / Vite plugin

Describe the bug

I've been trying out a few things with Qwik, and I didn't bother to use TypeScript, so my routes are just .jsx source files. Because of this, Vite is printing warnings about routeLoader$ not being located in the correct place, even though it's located in src/routes/index.jsx which seems like it should be allowed.

I suppose this happens because of these regexes:

const isLayout = /\/layout(|!|-.+)\.tsx?$/.test(path);
const isIndex = /\/index(|!|@.+)\.tsx?$/.test(path);
const isPlugin = /\/plugin(|@.+)\.tsx?$/.test(path);

Is there any reason why .jsx files would be considered invalid locations? If not, this should be an easy fix.

Reproduction

https://github.com/loriswit/eslint-plugin-qwik-bug

Steps to reproduce

Clone the repo, then run npm install and npm start (or npm run preview).

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i7-6700K CPU @ 4.00GHz
    Memory: 5.69 GB / 15.96 GB
  Binaries:
    Node: 20.10.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.2.5 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.19041.4355

Additional Information

Full console output:

[vite] warning: 'routeLoader$() are typically declared in route boundary files such as layout.tsx, index.tsx and plugin.tsx inside the src/routes directory
(docs: https://qwik.dev/docs/route-loader/).

This routeLoader$() is declared outside of the route boundaries. This may be useful when you want to create reusable logic or a library. In such a case, it is essential that this function is re-exported from within the router boundary otherwise it will not run.
(docs: https://qwik.dev/docs/cookbook/re-exporting-loaders/).

If you understand this, you can disable this warning with:
// eslint-disable-next-line qwik/loader-location

  Plugin: vite-plugin-qwik
  File: C:/Users/loris/Desktop/qwik-bug/src/routes/index.jsx:4:30
  2  |  import { routeLoader$ } from "@builder.io/qwik-city"
  3  |  
  4  |  export const useLoremIpsum = routeLoader$(async () => {
     |                                ^
  5  |    const response = await fetch("https://loripsum.net/api")
  6  |    return await response.text()
@loriswit loriswit added STATUS-1: needs triage New issue which needs to be triaged TYPE: bug Something isn't working labels May 22, 2024
@PatrickJS
Copy link
Member

can you make a pr to include jsx. it might be because some of the lint might require types but we can fix them as we run into them

@PatrickJS
Copy link
Member

you probably can make a pr to be

    const isLayout = /\/layout(|!|-.+)\.(t|j)sx?$/.test(path);
    const isIndex = /\/index(|!|@.+)\.(t|j)sx?$/.test(path);
    const isPlugin = /\/plugin(|@.+)\.(t|j)sx?$/.test(path);

@loriswit loriswit changed the title [🐞] ESLint: invalidLoaderLocation should not triggered if filename extension is JSX [🐞] ESLint: invalidLoaderLocation should not be triggered if filename extension is JSX May 23, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
STATUS-1: needs triage New issue which needs to be triaged TYPE: bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants