Why are some files so huge ( > 26MB) in nextJS exported Page?

user_1256697 0
Viewed 1505

I've created a webpage with nextjs and use next export to create an static page of it. I wonder why there are files with huge filesize in the output-directory (see: screenshot)

The page is pretty fast if I upload it to the server and run it in the browser. It seems that at least - even if the files _app.js and _index.jsexist in this directory - they are not used by the live-page.

But I wonder why are they so huge, and why they are in the output directory if not needed for production?

--

I'd analysed the bundle with "Webpack Bundle Analyzer" and still don't see, what the cause of such a huge filesize: enter image description here

--

I've created a tiny project from github and also run next build and next export, there is no _app.js, or _error.js at all in the output directory, but only the ones with the random-string in filename!

So might this depend on a miss configuration of my Environment?

next.js
1 Answers

I found the reason of this BUG!

It's a bit complicated, so I describe it step by step.

Let's say you have a clean Project, you never build. You do next build and next export, and the /out-Directory is created. (That's the expected behavior!)

If you have no clean project, you can simulate it with doing this steps on an existing Project:

  1. remove directories: .next, out, node-modules
  2. yarn install
  3. yarn next build
  4. yarn next export

For my current Project, this result in a /out-Directory with size of round about 5 MB.

so far: ALL FINE!

Now we reproduce the BUG:

  1. do next dev
  2. now - while next dev is still running, do a new next build
  3. at least do next export

You will find now some files in your /out-Directory, which are not needed for the live-enviroment (and shouldn't be there at all!). They will have a size somewhere in the range of MegaByte. (In my case it was _app.js, [pages].js... but I think it will be one file for each of your pages at least. You easily find them if you know, that they don't have an random-string in the filename)

For my project, the file-size for the out-Directory raised from round about 5 MB to round 20 MB

Additional important facts:

Stopping the next dev Process and running next export again WON'T fix the issue! You need to fully erase all content in your .next-Directory to fix this.

In a perfect World, the next export process should recognize, if there currently is next dev in Progress and give an error-message that this process first need to be closed.

user_12566970
Related