QwikDev / qwik

Instant-loading web apps, without effort
https://qwik.dev
MIT License
20.89k stars 1.31k forks source link

[🐞] No clear message in the exception #2286

Closed Nefcanto closed 2 years ago

Nefcanto commented 2 years ago

Which component is affected?

Qwik Runtime

Describe the bug

I want to fetch data on my page.

I use useEndpoint as specified in the docs.

I expect it to work. But it shows me this error:

container | 12:40:06 PM [vite] Internal server error: Code(20)
container |   File: /Base/Qwik/node_modules/@builder.io/qwik/core.cjs:73:58
container |   71 |          : '';
container |   72 |      const logError = (message, ...optionalParams) => {
container |   73 |          const err = message instanceof Error ? message : new Error(message);
container |      |                                                       ^
container |   74 |          // eslint-disable-next-line no-console
container |   75 |          console.error('%cQWIK ERROR', STYLE, err.message, ...printParams(optionalParams), err.stack);
container |       at logError (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:73:58)
container |       at logErrorAndStop (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:79:21)
container |       at qError (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:144:16)
container |       at useInvokeContext (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:676:19)
container |       at useSequentialScope (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:1294:21)
container |       at Proxy.useContext (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:2328:43)
container |       at useLocation (/Base/Qwik/node_modules/@builder.io/qwik-city/index.qwik.mjs:135:26)
container |       at Module.useEndpoint (/Base/Qwik/node_modules/@builder.io/qwik-city/index.qwik.mjs:225:14)
container |       at Blog (/Project/SiteQwik/src/routes/blog/[...path]/index.jsx:11:21)
container |       at invoke (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:698:30)
container |       at _flatVirtualChildren (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7368:25)
container |       at flatVirtualChildren (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7328:24)
container |       at splitProjectedChildren (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7037:30)
container |       at /Base/Qwik/node_modules/@builder.io/qwik/core.cjs:6982:36
container |       at then (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:357:60)
container |       at renderSSRComponent (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:6974:16)
container |       at renderNodeVirtual (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:6884:20)
container |       at renderNode (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7217:20)
container |       at processData (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7240:20)
container |       at renderNode (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7230:16)
container |       at processData (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7240:20)
container |       at walkChildren (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7277:20)
container |       at renderNodeVirtual (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:6903:25)
container |       at /Base/Qwik/node_modules/@builder.io/qwik/core.cjs:7006:20
container |       at async Promise.all (index 0)
container |       at async renderRoot (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:6842:9)
container |       at async renderSSR (/Base/Qwik/node_modules/@builder.io/qwik/core.cjs:6838:9)
container |       at async Proxy.renderToStream (/Base/Qwik/node_modules/@builder.io/qwik/server.cjs:663:3)
container |       at async /Base/Qwik/node_modules/@builder.io/qwik/optimizer.cjs:1768:28

Reproduction

https://github.com/Nefcanto/UseEndpoint/blob/main/src/routes/blog/%5B...path%5D/index.jsx

Steps to reproduce

1- Clone the repo above 2- npm install 3- Uncomment const blogData = useEndpoint() in the src/routes/blog/[...path]/index.jsx file 4- Go to /blog page.

System Info

System:
    OS: Linux 5.15 Debian GNU/Linux 11 (bullseye) 11 (bullseye)
    CPU: (4) x64 Intel(R) Core(TM) i7-5500U CPU @ 2.40GHz
    Memory: 8.36 GB / 15.37 GB
    Container: Yes
    Shell: 5.1.4 - /bin/bash
  Binaries:
    Node: 18.12.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.1.2 - /usr/local/bin/npm
  npmPackages:
    @builder.io/partytown: ^0.7.0 => 0.7.2 
    @builder.io/qwik: ^0.13.3 => 0.13.3 
    @builder.io/qwik-city: ^0.0.123 => 0.0.123 
    @builder.io/qwik-react: 0.1.1 => 0.1.1 
    vite: ^3.2.4 => 3.2.4

Additional Information

Make errors more descriptive.

A real-world project is a complex project. We're a website design agency and we design hundreds of websites for our customers each year.

We need to create some infrastructure using any platform or framework that we use.

We are very interested in Qwik, as we know Misko from Angular JS (he was the cause we left jQuery and started writing the web in a different way many years ago).

We know he's right about O(1). Thus we desire to leave Next.js and React and work with Qwik.

Please give us more data on errors so that we can troubleshoot the problem on our own side. Thank you so much.

manucorporat commented 2 years ago

Agreed this is critically important!

manucorporat commented 2 years ago

I am working to improve the error, there is one issue that makes dev mode to be disabled. The issue though is that you are using a use method useEndpoint() outside a component$(), you need to add component$() in every page.

Nefcanto commented 2 years ago

@manucorporat, yeah I found it using trial and error. However, it's extremely useful if we can get a clear message like You forgot to use component$. That would save us hours.

The point is because Qwik is by design very similar to React, many React developers would fall into this pit. I'm sure about that.

We tested our first website using Qwik and our infrastructure (docker, Nginx reverse proxy, modular development, symbolic links, etc.) and we're so happy. The same site on Next got less than 80 in Google PageSpeed, and the same content using Qwik became 96.

We might completely migrate to Qwik in near future.

And I would gladly help in any form or shape. I love you guys.

manucorporat commented 2 years ago

Agreed! look at the new error message!

Screenshot 2022-11-29 at 15 19 09

so happy to hear that! let us know when it's live we will love to add it here: https://qwik.builder.io/showcase/

Nefcanto commented 2 years ago

Awesome message. Thank you so much.

Sure I will show them one by one as we deliver them to customers in the production environment.

Meanwhile, I'm reading the contribution document. I would love to help.