qwik icon indicating copy to clipboard operation
qwik copied to clipboard

[🐞] Dynamically loaded module is not shown

Open Nefcanto opened this issue 2 years ago • 2 comments

Which component is affected?

Qwik Runtime

Describe the bug

I'm trying to load a module dynamically. Either it exists or it does not.

If it does not exist, I show a fallback UI. If it exists, I show the dynamically loaded module.

It was working in previous versions.

This is the code:

export default component$(() => {
  let DynamicComponent = null;
  try {
    import('../components/something')
      .then((result) => {
        DynamicComponent = result;
        console.log(DynamicComponent);
      })
      .catch((error) => console.log(error));
  } catch (e) {
    console.log(e);
  }
  console.log(DynamicComponent);

  return DynamicComponent ? <DynamicComponent /> : <div>hi</div>;
});

Reproduction

https://stackblitz.com/edit/qwik-starter-jxe3yh?file=src%2Froutes%2Findex.tsx,src%2Fcomponents%2Fsomething.jsx

Steps to reproduce

  • Click on the reproduction link
  • See the logs

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (4) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
  npmPackages:
    @builder.io/qwik: 0.24.0 => 0.24.0 
    @builder.io/qwik-city: ~0.7.0 => 0.7.0 
    undici: 5.21.0 => 5.21.0 
    vite: 4.2.1 => 4.2.1

Additional Information

No response

Nefcanto avatar Apr 02 '23 14:04 Nefcanto

Hello guys. Any update on this issue?

fmotlagh03 avatar May 01 '23 07:05 fmotlagh03

I have different examples of runtime components https://github.com/PatrickJS/experiments-qwik-runtime-components

you can also use <Resource> and pass a promise of the component to be resolved

(please open a new issue if you want something else)

PatrickJS avatar May 06 '24 18:05 PatrickJS