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.
TranspiledModule error: module hasn't been transpiled yet
See original GitHub issueIssue Description
Bug report
Packages affected
- [✔] sandpack-client
- [✔] sandpack-react
Description
A /some/module/path: hasn't been transpiled yet. error gets displayed in SandpackPreview’s ErrorOverlay under certain conditions.
🚨 Severity
This seems to prevent Sandpack from working correctly in Safari.
I’d love to get some guidance on how to arrange the files, import statements, or how to halt the execution of the bundled modules until everything is transpiled.
What were you doing when the problem occurred?
I added a large number of files, and a few library dependencies, and then imported them inside the files. After working in Firefox 100 and Chrome 100 for a while, I noticed the error in macOS Safari 15.4 and iOS Safari 15.4.1.
What steps can we take to reproduce the problem?
Quick reproduction
- Open this page in Safari: https://andyjakubowski.github.io/bug-sandpack-module-not-transpiled-yet.
- Click the Reload button a few times in the second Sandpack.
- You may need to click the reload button several times, sometimes it takes 10 reloads before the error is thrown.
- You should see an error that says
/subfolder/cranberry.js: hasn't been transpiled yet..
Additional observations
- In the example, changing the path of a bundled file from a nested path
subfolder/cranberry.jsto a root path/cranberry.jsmakes a difference. - In the example, removing an
importstatement for a library likexstatealso removes the error. - But when I bundle more files in my real project, having all files’ paths set up at the root level no longer helps, and the error is displayed again.
- This error is thrown in the
TranspiledModule.evaluatemethod insandpack-core. It has this comment:This scenario only happens when we are in an inconsistent state, the quickest way to solve this state is to just hard reload everything.. - When the reproduction repo is run in CodeSandbox in Safari, the error doesn’t seem to be thrown as much upon reloading.
Reproduction repo: link
Live demo: link
Link to sandbox: link
Your Environment
| Software | Name/Version |
|---|---|
| Sandpack-client version | |
| Sandpack-react version | ^0.19.9 |
| Browser | Safari 15.4 |
| Operating System | macOS Monterey 12.3 |
Issue Analytics
- State:
- Created 9 months ago
- Comments:9 (5 by maintainers)
Top Results From Across the Web
Top Related Medium Post
Top Related StackOverflow Question
Troubleshoot Live Code
Top Related Reddit Thread
Top Related Hackernoon Post
Top Related Tweet
Top Related Dev.to Post
Top Related Hashnode Post
Yes the v2 bundler has it’s own repository where you can post all the issues you encounter https://github.com/codesandbox/sandpack-bundler
This seems questionably related, but I have a dependency that doesn’t work with Webpack5 without Webpack polyfills. As far as I can tell, there is no exposed access to webpack. With the v1 bundler there is a separate issue with this dependency regarding circular dependency errors as such
Class extends value undefined is not a constructor or null (3:0), which I haven’t seen using this dependency outside of Sandpack.This may be a separate issue, so happy to repost with more details and repro, but this thread helped me get this far. Cheers!