How to obtain production environment react.lazy Our support

Is your feature request related to a problem? Please describe.

react.lazy It’s available during development, like this

const Component = lazy(() => import(`../pages${page}`));

But after build, the import failed

Describe the solution you’d like

After build, it can work normally

Describe alternatives you’ve considered

Additional context

I just tried to use vite in react to see if I could migrate from CRA 😌

[ppbl]

@jonaskuske Thank you very much.👍

Try to add a file extension to your import statement, e.g.

import(`../pages/${page}.js`)

Vite is using rollup for its build, so I assume the same limitations apply when it comes to dynamic imports: https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations

I’ve looked at the restrictions again, and now I understand

Two main points

1. There must be a static part
2. Must end with extension

import(`../pages/${page}/index.tsx`)

Since my page was a directory, I need to add it now index.tsx

And dynamic import vars has been introduced😂

Okay, I feel like I’m stupid. I’ll close this issue later🤦‍♂️

[jonaskuske]

Awesome, glad I could help! 🤞