we use vercel for hosting our next.js project, which worked properly until now. After a while, I've just deployed my site to vercel which has a lot of pregenerated static pages (FAQ pages localized version ca 7500 sites) (earlier it worked...)
Here is the Build log:
[15:22:56.443] Cloning github.com/*** (Branch: main, Commit: 7458f54)
[15:22:57.144] Cloning completed: 701.296ms
[15:22:57.492] Installing build runtime...
[15:23:00.574] Build runtime installed: 3.082s
[15:23:01.366] Looking up build cache...
[15:23:01.611] Build Cache not found
[15:23:01.808] Installing dependencies...
[15:23:01.809] Detected `package-lock.json` generated by npm 7...
[15:23:10.887] npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
[15:23:11.276] npm WARN deprecated source-map-url@0.4.0: See https://github.com/lydell/source-map-url#deprecated
[15:23:11.727] npm WARN deprecated request-promise-native@1.0.9: request-promise-native has been deprecated because it extends the now deprecated request package, see https://github.com/request/request/issues/3142
[15:23:11.781] npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
[15:23:12.182] npm WARN deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecated
[15:23:12.295] npm WARN deprecated querystring@0.2.1: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
[15:23:12.585] npm WARN deprecated sane@4.1.0: some dependency vulnerabilities fixed, support for node < 10 dropped, and newer ECMAScript syntax/features added
[15:23:14.213] npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
[15:23:14.691] npm WARN deprecated har-validator@5.1.5: this library is no longer supported
[15:23:14.966] npm WARN deprecated flatten@1.0.3: flatten is deprecated in favor of utility frameworks such as lodash.
[15:23:18.649] npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
[15:23:19.369] npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See https://v8.dev/blog/math-random for details.
[15:23:22.146] npm WARN deprecated popper.js@1.16.1: You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1
[15:23:24.656] npm WARN deprecated core-js@1.2.7: core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
[15:23:31.757]
[15:23:31.757] added 1284 packages in 30s
[15:23:31.757]
[15:23:31.758] 123 packages are looking for funding
[15:23:31.758] run `npm fund` for details
[15:23:31.783] Detected Next.js version: 12.1.0
[15:23:31.796] Detected `package-lock.json` generated by npm 7...
[15:23:31.797] Running "npm run build"
[15:23:32.080]
[15:23:32.081] > nextjs-builder-io-landing-page@1.0.0 build
[15:23:32.081] > next build
[15:23:32.081]
[15:23:32.551] info - Loaded env from /vercel/path0/.env.production
[15:23:32.729] Attention: Next.js now collects completely anonymous telemetry regarding usage.
[15:23:32.729] This information is used to shape Next.js' roadmap and prioritize features.
[15:23:32.729] You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
[15:23:32.729] https://nextjs.org/telemetry
[15:23:32.729]
[15:23:32.767] info - Checking validity of types...
[15:23:36.278] warn - No ESLint configuration detected. Run next lint to begin setup
[15:23:36.285] info - Creating an optimized production build...
[15:23:36.286] warn - using beta Middleware (not covered by semver) - https://nextjs.org/docs/messages/beta-middleware
[15:23:37.976]
[15:23:37.976] warn - The `purge`/`content` options have changed in Tailwind CSS v3.0.
[15:23:37.976] warn - Update your configuration file to eliminate this warning.
[15:23:58.984] info - Compiled successfully
[15:23:58.985] info - Collecting page data...
[15:24:02.966] info - Generating static pages (0/7848)
[15:24:07.379] info - Generating static pages (1962/7848)
[15:24:09.446] info - Generating static pages (3924/7848)
[15:24:11.397] info - Generating static pages (5886/7848)
[15:24:15.350] info - Generating static pages (7848/7848)
[15:24:15.367] info - Finalizing page optimization...
[15:24:17.180]
[15:24:17.230] Page Size First Load JS
[15:24:17.230] ┌ ○ /__builder-customgrid__ 3.8 kB 152 kB
[15:24:17.230] ├ ○ /__builder-customlist__ 2.94 kB 158 kB
[15:24:17.230] ├ ○ /__builder-hero__ 3.37 kB 152 kB
[15:24:17.231] ├ ○ /__builder-money__ 1.32 kB 153 kB
[15:24:17.231] ├ ○ /__builder-nav__ 2.29 kB 167 kB
[15:24:17.231] ├ ○ /__builder-subtab__ 2.76 kB 141 kB
[15:24:17.231] ├ ○ /__builder-tabcontent__ 4.95 kB 153 kB
[15:24:17.231] ├ /_app 0 B 129 kB
[15:24:17.231] ├ ƒ /_middleware 36.4 kB 166 kB
[15:24:17.231] ├ ● /[[...page]] 138 kB 313 kB
[15:24:17.231] ├ └ css/f63802154ef558ff.css 1.21 kB
[15:24:17.231] ├ ○ /404 2.47 kB 141 kB
[15:24:17.231] ├ ○ /500 2.39 kB 141 kB
[15:24:17.231] ├ λ /api/sitemap 0 B 129 kB
[15:24:17.231] ├ λ /blog 2.45 kB 161 kB
[15:24:17.231] ├ ● /blog/[article] (ISR: 5 Seconds) (4886 ms) 790 B 159 kB
[15:24:17.231] ├ ├ /default/blog/%2Fblog%2Fblog5 (581 ms)
[15:24:17.231] ├ ├ /default/blog/%2Fblog%2Fblog2-is-lehet (554 ms)
[15:24:17.231] ├ ├ /default/blog/%2Fblog%2Fblog6 (551 ms)
[15:24:17.231] ├ ├ /default/blog/%2Fblog%2Fblog-3-url (547 ms)
[15:24:17.231] ├ ├ /default/blog/%2Fblog%2Fblog-8-english (544 ms)
[15:24:17.232] ├ ├ /default/blog/%2Fblog%2Fblog4 (542 ms)
[15:24:17.232] ├ ├ /default/blog/%2Fblog%2Fblog7 (529 ms)
[15:24:17.232] ├ └ [+2 more paths] (avg 519 ms)
[15:24:17.232] ├ ○ /builder-symbol 351 B 172 kB
[15:24:17.232] ├ ● /help/[maincategory] (1386 ms) 4.07 kB 162 kB
[15:24:17.232] ├ ├ /default/help/how-can-i-get-a-wallet
[15:24:17.232] ├ ├ /default/help/how-much-does-it-cost-to-register-a-new-wallet
[15:24:17.232] ├ ├ /default/help/what-is-the-difference-between-a-personal-and-a-business-wallet
[15:24:17.232] ├ └ [+340 more paths]
[15:24:17.232] ├ ● /help/[maincategory]/[subcategory] (447 ms) 4.3 kB 165 kB
[15:24:17.232] ├ ├ /default/help/business/how-can-i-get-a-wallet
[15:24:17.232] ├ ├ /default/help/business/send-money
[15:24:17.232] ├ ├ /default/help/business/receive-money
[15:24:17.232] ├ └ [+110 more paths]
[15:24:17.232] ├ ● /help/[maincategory]/[subcategory]/[help] (20710 ms) 3.87 kB 162 kB
[15:24:17.232] ├ ├ /default/help/business/how-can-i-get-a-wallet/what-is-identification-and-why-is-it-necessary
[15:24:17.232] ├ ├ /default/help/business/how-can-i-get-a-wallet/how-are-individuals-identified
[15:24:17.232] ├ ├ /default/help/business/how-can-i-get-a-wallet/how-can-i-top-up-my-wallet
[15:24:17.232] ├ └ [+7272 more paths]
[15:24:17.233] ├ ● /integrations-and-plugins 3.11 kB 161 kB
[15:24:17.233] └ ● /integrations-and-plugins/[id] 1.46 kB 160 kB
[15:24:17.233] + First Load JS shared by all 129 kB
[15:24:17.233] ├ chunks/framework-5f4595e5518b5600.js 42 kB
[15:24:17.233] ├ chunks/main-30b5b660246d0905.js 32.6 kB
[15:24:17.233] ├ chunks/pages/_app-ad24afc8f8ad930a.js 52.8 kB
[15:24:17.233] ├ chunks/webpack-dd16877f2d410294.js 1.9 kB
[15:24:17.233] └ css/84deb26cd7ef277b.css 10.5 kB
[15:24:17.234]
[15:24:17.234] ƒ (Middleware) intercepts requests (uses _middleware)
[15:24:17.234] λ (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps)
[15:24:17.234] ○ (Static) automatically rendered as static HTML (uses no initial props)
[15:24:17.235] ● (SSG) automatically generated as static HTML + JSON (uses getStaticProps)
[15:24:17.235] (ISR) incremental static regeneration (uses revalidate in getStaticProps)
[15:24:17.235]
[15:24:20.013] Traced Next.js server files in: 268.788ms
[15:24:20.666] Created all serverless functions in: 652.943ms
[15:24:23.997] Uploading build outputs...
[15:26:55.132] Deploying build outputs...
[15:53:13.710] An unexpected internal error occurred
I contacted the support, but no answer yet, and also saw a github thread 2 weeks ago: https://github.com/vercel/community/discussions/436
Any idea how can I solve this?
Anyways, I tried with the FAQ page fallback option set to true, false, blocking, none of them seems to work.
Your build is crashed for no visible reasons - try to reduce build time.
Once I have contacted Vercel support (support@vercel.com) for mostly the same issues, they investigated my reasons, but they mostly recommend me to reduce build time (<30 mins it's ok)
You need to set your pages with ISR.
ISR does not mean that all your pages will be rendered during build, it means if your page wasn't rendered during the build and will be stored in cache once visited
Example: imagine you have 15999 categories to build. Max build time is 45 mins according to vercel docs. You should build only part of information during build (500 categories). So, in getStaticPaths, you need to get only 500 categories and make it "lightweight" - include only your parameter (in my example its' pid)
Try to adapt all your pages to reduce build time. Also, don't forget about Vercel API limits.
Here is my example:
export async function getStaticProps(context) {
const pid = context.params.pid;
if (context.params.pid == 'undefined'){
console.log("here we have an error: " + pid)
}
//you render your category
const res = await fetch(process.env.APIpath + '/api/public/category/getCategory?pid=' + (pid));
const data = await res.json();
return {
props: {
...(await serverSideTranslations(context.locale, ['common'])),
category: data
}
}
}
export async function getStaticPaths(context) {
// you render only 500 products intead of 15666 products
const res = await fetch(process.env.APIpath + '/api/public/category/getFewCategories')
const posts = await res.json()
let paths = []
for (const post of posts){
//I am using multilanguage here
for (const locale of context.locales){
paths.push({params: {pid: post.linkRewrite[locale] }, locale: locale})
}
}
return { paths, fallback: 'blocking'}
}