⚠️These are my quick and dirty notes about the issues I encountered when developing sites with Next.js. Module not found: Error can't resolve 'child_process', how to fix?Image is missing required "width" (or "height") property.React Hydration Error: Error: Hydration failed because the initial UI does not match what was rendered on the server. (read more)🚨 Error: HTTPError: Response code 417 (Expectation Failed) when upload image to imgur.Text content does not match server-rendered HTML. (Error: Minified React error #418)Request to Notion API failed with status: 502 khi build hoặc khi dùng yarn dev mà load 1 trang nào đó → chỉ cần thử lại là ok!Warning: data for page "/[postSlug]" (path "/17-phuong-trinh-lam-thay-doi-the-gioi/") is 163 kB which exceeds the threshold of 128 kB, this amount of data can reduce performance.See more info here: https://nextjs.org/docs/messages/large-page-dataRequest to Notion API has timed outFunction components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?Type 'KeyboardEvent' is not generic.tsError: NextRouter was not mounted.Extra attributes from the server: cz-shortcut-listenSomething went wrong installing the "sharp" module OR Cannot find module 'relative "../build/Release/sharp-" <dynamic> ".node"’[Error: Input file is missing: https://www.notion.so/images/page-cover/woodcuts_2.jpg]TypeError: Super expression must either be null or a functionModule not found: Can't resolve 'fs' ← Lỗi xuất hiện khi cài và sử dụng plaiceholderError: Input buffer has corrupt header: magickload_buffer: Magick: must specify image sizeProp className did not match….Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './server.edge' is not defined by "exports”Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.Warning: Expected server HTML to contain a matching <div> in <article>.Cannot find module 'sharp’(with SST when deploying to AWS) Warning: Text content did not match. Server:Why dev mode keep reloading?Cannot be used as a JSX component.React refers to UMD global, but the current file is a moduleError: Attempted to call the default export of [project]/src/tools/UuidGeneratorDecoder.tsx from the server but it's on the client. It's not possible to invoke a client function from the server, it can only be rendered as a Component or passed to props of a Client Component.async/await is not yet supported in Client Components, only Server Components. This error is often caused by accidentally adding 'use client' to a module that was originally written for the serverSuper expression must either be null or a function nextjs 13Event handlers cannot be passed to Client Component props onClick={function}missing field source at line 1 column 2 nextjsFirebaseAppError: Failed to parse private key: Error: Invalid PEM formatted message. ← \n chatacter in the env variableThe resource <URL> was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally.
⚠️These are my quick and dirty notes about the issues I encountered when developing sites with Next.js. Module not found: Error can't resolve 'child_process', how to fix?Image is missing required "width" (or "height") property.React Hydration Error: Error: Hydration failed because the initial UI does not match what was rendered on the server. (read more)🚨 Error: HTTPError: Response code 417 (Expectation Failed) when upload image to imgur.Text content does not match server-rendered HTML. (Error: Minified React error #418)Request to Notion API failed with status: 502 khi build hoặc khi dùng yarn dev mà load 1 trang nào đó → chỉ cần thử lại là ok!Warning: data for page "/[postSlug]" (path "/17-phuong-trinh-lam-thay-doi-the-gioi/") is 163 kB which exceeds the threshold of 128 kB, this amount of data can reduce performance.See more info here: https://nextjs.org/docs/messages/large-page-dataRequest to Notion API has timed outFunction components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?Type 'KeyboardEvent' is not generic.tsError: NextRouter was not mounted.Extra attributes from the server: cz-shortcut-listenSomething went wrong installing the "sharp" module OR Cannot find module 'relative "../build/Release/sharp-" <dynamic> ".node"’[Error: Input file is missing: https://www.notion.so/images/page-cover/woodcuts_2.jpg]TypeError: Super expression must either be null or a functionModule not found: Can't resolve 'fs' ← Lỗi xuất hiện khi cài và sử dụng plaiceholderError: Input buffer has corrupt header: magickload_buffer: Magick: must specify image sizeProp className did not match….Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './server.edge' is not defined by "exports”Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.Warning: Expected server HTML to contain a matching <div> in <article>.Cannot find module 'sharp’(with SST when deploying to AWS) Warning: Text content did not match. Server:Why dev mode keep reloading?Cannot be used as a JSX component.React refers to UMD global, but the current file is a moduleError: Attempted to call the default export of [project]/src/tools/UuidGeneratorDecoder.tsx from the server but it's on the client. It's not possible to invoke a client function from the server, it can only be rendered as a Component or passed to props of a Client Component.async/await is not yet supported in Client Components, only Server Components. This error is often caused by accidentally adding 'use client' to a module that was originally written for the serverSuper expression must either be null or a function nextjs 13Event handlers cannot be passed to Client Component props onClick={function}missing field source at line 1 column 2 nextjsFirebaseAppError: Failed to parse private key: Error: Invalid PEM formatted message. ← \n chatacter in the env variableThe resource <URL> was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally.