Today's Work: Button Styling and Netlify Deployment Troubleshooting
Button Design Fix
- Fixed the button size by setting
width: 56px
andheight: 204px
directly in theclassName
styles for consistent appearance.
Netlify Deployment Challenges with Next.js Types
I encountered common type-related build errors during deployment related to Next.js’s official LayoutProps
type.
Key Issues:
- The definition of
LayoutProps
has likely changed in the latest Next.js 15.x series. - Specifically, the
params
property may sometimes be passed as a Promise (i.e., asynchronous), while normally it is expected to be a simple object like{ locale: string }
.
Workarounds Tried:
- Build without specifying a return type for the layout component (removing
Promise<ReactElement>
). - Use
{ locale: string }
type directly forparams
. If build errors persist, suspect Next.js type definition changes. - If the latest Next.js requires asynchronous
params
, adjust the typing accordingly or fallback toany
to bypass type errors temporarily.
Deployment Result and 404 Error
- Deployment succeeded but the page returned a 404 error.
- Removing the i18n config from
next.config.js
resolved the 404 issue:
// Removed this block
i18n: {
locales: ['ja', 'en'],
defaultLocale: 'ja',
}
tags: nextjs, netlify, typescript, i18n, frontend, portfolio
Top comments (0)