Closed Vadorequest closed 3 years ago
@ricokahler I think you need to add some config for fs
in https://github.com/ricokahler/next-plugin-preval/blob/main/src/create-next-plugin-preval.ts
//webpack.config.js
module.exports = {
...
resolve: {
fallback: {
"fs": false
},
}
}
Could you try to load a file that requires the fs
module and see if it works? I believe it will fail, unless fs
is being ignored.
I've added my own fs
ignore at https://github.com/UnlyEd/next-right-now/blob/38e5ac60bbd3b6e3c9f3893ab47f5258762c4d20/next.config.js#L227-L232 but it feels like it's being ignored, maybe overridden?
I'm having a bit of trouble reproducing this. I recently added a next example app to the alpha branch as well as a build command to rapidly test out scenarios like this.
Could you take a look at this branch?
I created an example that imports something with fs
and it seems to build correctly.
In order to run this example on your machine, clone the branch, npm i
and then run build-example-app
which should build that example next app.
Let me know if you see any differences in the configuration or set up, very willing to look into this!
I've also tried to import fs from my own project in a x.preval.ts
file and it works fine.
https://github.com/UnlyEd/next-right-now/pull/345 at commit #1
I've made some other tests and it might be my mistake... One of the functions being exported in the file that imports fs
seems to be imported from components (Next.js pages) outside of getServerSideProps/getStaticProps/etc. and that's likely to be the root issue.
it's hard to know without that stack trace so i'm really prioritizing that issue 😓😅
Yeah, I can confirm it has nothing to do with next-plugin-preval, it was because one of the function in the file was being used from a file served to the client and bundled using the "browser" Webpack version.
I'm closing this! Thanks for your feedback, it really helped me figuring out the true culprit 😅
Thanks for this plugin, it helps solving a long-standing pain point with shared/app-wide data.
I've spent several hours working on it today and I have a few feedbacks I hope you'll find useful.
A ran into an issue where depending on how I write some import in my code, it crashes this plugin. I got really lucky there because the error message is crytic and I basically figured it out because I wrote it the right way (using default import) first, and then refactored stuff and used a named import which crashed the whole app. After some digging I found the root cause, but it's a really bad dev experience, and makes the code not resilient to changes. I believe it should be fixed.
I ran into another mind-blowing issue in regard to Webpack, where if I import a function that relies on
fs
, the whole app crashes. This didn't happen before using this plugin. Also, that same "fs" code is actually called by the plugin and it works well. It looks like an edge case. I found a workaround by calling the code directly from the page, which works fine 🤯.👍 Works fine
In Next.js page
⚠️ Crashes
In Next.js page
In
getAirtableDataset.ts
The code does basically the same thing, the only difference is the call site which isn't the same file. This is very odd, too.
Here is the commit where I fixed the bug, might be more helpful to give a raw overview: https://github.com/UnlyEd/next-right-now/commit/a7406f771db431507685493b8e7b4c4e63e3ffc1
@ricokahler All the code I wrote today is open source and available at https://github.com/UnlyEd/next-right-now/pull/334, I can make a repro if you're willing to investigate this issue. 😄