Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update troubleshooting.mdx to include common causes of inflated build size #86

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions pages/cloudflare/troubleshooting.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,10 @@ If you need to deploy to Cloudflare Pages, you can use `@cloudflare/next-on-page

The Cloudflare Account you are deploying to is on the Workers Free plan, which [limits the size of each Worker to 3 MiB](https://developers.cloudflare.com/workers/platform/limits/#worker-size). When you subscribe to the Workers Paid plan, each Worker can be up to 10 MiB.

Some common underlying factors could be:
- [Metadata Icons](https://nextjs.org/docs/app/api-reference/file-conventions/metadata/app-icons)
- Assets located outside of the public directory
Comment on lines +19 to +20
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it would be great to expand here and probably ref some solutions?

i.e.
What do you mean by "metadata"?
What are "Assets located outside of the public directory"?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Metadata: I had an icon.png and apple-icon.png that I had followed those docs for and they added almost half a meg and put me over the 3mb limit.

Assets: I’ve dealt with using raw-loader to include files in build before (ie. Custom shaders) and while they aren’t as large, they’re not assets and so would be bundled with the code.

Definitely open to more suggestions for things to add but those are the main ones I ran into/thought of.

Wording could definitely be better on my end.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Metadata: I had an icon.png and apple-icon.png that I had followed those docs for and they added almost half a meg and put me over the 3mb limit.

2 remarks:
My first question was more if we need "Metadata" in "Metadata Icons"?
We should find a way to move the image to the asset so that they don't count towards the code size limit.
Could you open an issue on the adapter repo with a minimal repro?

Assets: I’ve dealt with using raw-loader to include files in build before (ie. Custom shaders) and while they aren’t as large, they’re not assets and so would be bundled with the code.

Here I think it's important to mention "raw loader" because that's the source of the pb.
For your own problem, maybe it's possible to fetch them from the assets?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I’ll open reproduction in the morning. It’s an open source site so the commit that initially caused the issue for the icons is here:
SelfhostedPro/AdaptAxe-Site@d942873

I don’t need raw-loader in my current project but thought it would be good to include if others run into it.


### My app fails to build when I import a specific NPM package

First, make sure that the `nodejs_compat` compatibility flag is enabled, and your compatibility date is set to on or after "2024-09-23", in your [wrangler configuration file](https://developers.cloudflare.com/workers/wrangler/configuration/).
Expand Down