Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
router dynamic import component build error
See original GitHub issue- Read the docs.
- Use Vite >=2.0. (1.x is no longer supported)
- If the issue is related to 1.x -> 2.0 upgrade, read the Migration Guide first.
Describe the bug
master branch: use router
dev branch: not use
use vue-router-next
component: () => import("../Home.vue"),
but when build bundle, var Symbol = root.Symbol; from lodash-es does not transform
https://github.com/Iroha1024/vite-router-dynamic-import/blob/master/dist/assets/Home.4f483dda.js#L7
This causes Symbol in line 2 to be undefined
exports[Symbol.toStringTag] = "Module";
not use router
var Symbol$1 = root.Symbol;
Reproduction
https://github.com/Iroha1024/vite-router-dynamic-import
yarn build
see dist file
System Info
viteversion: ^2.0.0-beta.65- Operating System: win10
- Node version: v12.14.0
- Package manager (npm/yarn/pnpm) and version: yarn 1.22.10
Issue Analytics
- State:
- Created 3 years ago
- Comments:10 (5 by maintainers)
Top Results From Across the Web
Component dynamic import doesn't work from router.js
In both cases, the component is nested in some "default" object. But with Nuxt.js it seems you must import that object explicitly, whereas...
Read more >[SOLVED] - Dynamic import not working - help - Meteor.js forums
This creates a new component everytime the route is rendered. Each re-render results to mount and unmount instead of just updating.
Read more >Dynamic Import, Code Splitting, Lazy Loading, and Error ...
Try it. You will encounter the error: “Cannot find module with dynamic import.” This error comes from Webpack, which is used by Create...
Read more >Advanced Features: Dynamic Import - Next.js
Dynamically import JavaScript modules and React Components and split your code into manageable chunks.
Read more >React dynamic imports and route-centric code splitting guide
Suspense, React Router, and Loadable Components. ... Sometimes a user can even get an error, due to dynamic imports being asynchronous.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Vite’s default build output expects the environment to be modern, i.e.
Symbolshould be available natively.The code of
lodash-estrying to grab Symbol based on env is irrelevant.Thanks for your answer. I will solve this problem myself
By the way, #1826 seems to have not been solved