npm build error with react #47755

Frankjunyulin · 2023-03-27T18:17:40Z

Frankjunyulin
Mar 27, 2023

Verify canary release

I verified that the issue exists in the latest Next.js canary release

Provide environment information

My package.json:
"""
{
  "name": "dear",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@aws-amplify/core": "^5.0.15",
    "@aws-amplify/ui-react": "^4.3.8",
    "@emotion/react": "^11.10.5",
    "@emotion/styled": "^11.10.5",
    "@headlessui/react": "^1.7.3",
    "@heroicons/react": "^2.0.12",
    "@mui/material": "^5.10.16",
    "@prisma/client": "^4.10.1",
    "aws-amplify": "^5.0.15",
    "next": "^12.3.1",
    "openai": "^3.1.0",
    "react": "^18.2.0",
    "react-code-blocks": "^0.0.9-0",
    "react-dom": "^18.2.0",
    "react-spinners": "^0.13.8",
    "reactflow": "^11.0.0"
  },
  "devDependencies": {
    "@types/node": "18.8.2",
    "@types/react": "^18.0.21",
    "@types/react-dom": "^18.0.6",
    "autoprefixer": "^10.4.12",
    "eslint": "8.24.0",
    "eslint-config-next": "12.3.1",
    "postcss": "^8.4.17",
    "prisma": "^4.10.1",
    "tailwindcss": "^3.1.8",
    "typescript": "4.8.4"
  }
}

"""

Which area(s) of Next.js are affected? (leave empty if unsure)

No response

Link to the code that reproduces this issue

It is in private repo. But let me know how I can share if really need it

To Reproduce

While I run the npm run build, I got following error:
"""
Error: A is used but it is missing a show={true | false} prop.
at file:///Users/flin/workplay/Dear/dear/node_modules/@headlessui/react/dist/components/transitions/transition.js:1:5045
at Wc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:68:44)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:73:362)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)

Error occurred prerendering page "/components/BotConfirm". Read more: https://nextjs.org/docs/messages/prerender-error
Error: A is used but it is missing a show={true | false} prop.
at file:///Users/flin/workplay/Dear/dear/node_modules/@headlessui/react/dist/components/transitions/transition.js:1:5045
at Wc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:68:44)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:73:362)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
Empty Bot
undefined
TypeError: Cannot read properties of undefined (reading 'id')
at BotDetails (/Users/flin/workplay/Dear/dear/.next/server/chunks/269.js:164:63)
at Wc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:68:44)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:253)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at $c (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:78:98)
at bd (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:77:404)

Error occurred prerendering page "/components/BotDetails". Read more: https://nextjs.org/docs/messages/prerender-error
TypeError: Cannot read properties of undefined (reading 'id')
at BotDetails (/Users/flin/workplay/Dear/dear/.next/server/chunks/269.js:164:63)
at Wc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:68:44)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:253)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at Zc (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:70:481)
at Z (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:76:89)
at $c (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:78:98)
at bd (/Users/flin/workplay/Dear/dear/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:77:404)
info - Generating static pages (19/19)

Build error occurred
Error: Export encountered errors on following paths:
/components/BotConfirm
/components/BotDetails
at /Users/flin/workplay/Dear/dear/node_modules/next/dist/export/index.js:404:19
at runMicrotasks ()
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Span.traceAsyncFn (/Users/flin/workplay/Dear/dear/node_modules/next/dist/trace/trace.js:79:20)
at async /Users/flin/workplay/Dear/dear/node_modules/next/dist/build/index.js:1230:21
at async Span.traceAsyncFn (/Users/flin/workplay/Dear/dear/node_modules/next/dist/trace/trace.js:79:20)
at async /Users/flin/workplay/Dear/dear/node_modules/next/dist/build/index.js:1092:17
at async Span.traceAsyncFn (/Users/flin/workplay/Dear/dear/node_modules/next/dist/trace/trace.js:79:20)
at async Object.build [as default] (/Users/flin/workplay/Dear/dear/node_modules/next/dist/build/index.js:65:29)
"""

Describe the Bug

The error looks weird. And I don't really think I made any changes as the error log said.

I tried to remove node_modules and rerun npm install. But it is still not working.

Expected Behavior

npm run build should succeed or at least display error messages that making sense.

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

next run build

JuliusGudni · 2023-03-27T20:51:08Z

JuliusGudni
Mar 27, 2023

You have to provide additional code for others to help.

Error occurred prerendering page "/components/BotDetails". TypeError: Cannot read properties of undefined (reading 'id') at BotDetails

It appears that you're attempting to obtain data that is not available and is designated as a required value.

The subsequent passage indicates that your error log suggests this is the most likely issue:
Empty Bot undefined

Please share the repo so that others can reproduce the error and offer support.

0 replies

Frankjunyulin · 2023-03-28T02:08:08Z

Frankjunyulin
Mar 28, 2023
Author

I did more investigation.

Now only when I changed the file app.tsx.

My app.tsx:
"""
Amplify.configure({
aws_project_region: "us-east-1",
aws_cognito_identity_pool_id:
"us-east-1:e1b23467-b561-4511-8c7a-91cda3bbc0cc",
aws_cognito_region: "us-east-1",
aws_user_pools_id: "us-east-1_hHUKoCPHp",
aws_user_pools_web_client_id: "57fh330o1c8lalef69g6i6h6dc",
oauth: {
domain: "dear3683324a-3683324a-dev.auth.us-east-1.amazoncognito.com",
scope: [
"phone",
"email",
"openid",
"profile",
"aws.cognito.signin.user.admin",
],
redirectSignIn: "https://www.dearai.online/",
redirectSignOut: "https://www.dearai.online/",
responseType: "code",
},
federationTarget: "COGNITO_USER_POOLS",
aws_cognito_username_attributes: [],
aws_cognito_social_providers: [],
aws_cognito_signup_attributes: ["EMAIL"],
aws_cognito_mfa_configuration: "OPTIONAL",
aws_cognito_mfa_types: ["SMS"],
aws_cognito_password_protection_settings: {
passwordPolicyMinLength: 8,
passwordPolicyCharacters: [],
},
aws_cognito_verification_mechanisms: ["EMAIL"],
ssr: true,
});
Auth.configure({
aws_project_region: "us-east-1",
aws_cognito_identity_pool_id:
"us-east-1:e1b23467-b561-4511-8c7a-91cda3bbc0cc",
aws_cognito_region: "us-east-1",
aws_user_pools_id: "us-east-1_hHUKoCPHp",
aws_user_pools_web_client_id: "57fh330o1c8lalef69g6i6h6dc",
oauth: {
domain: "dear3683324a-3683324a-dev.auth.us-east-1.amazoncognito.com",
scope: [
"phone",
"email",
"openid",
"profile",
"aws.cognito.signin.user.admin",
],
redirectSignIn: "https://www.dearai.online/",
redirectSignOut: "https://www.dearai.online/",
responseType: "code",
},
federationTarget: "COGNITO_USER_POOLS",
aws_cognito_username_attributes: [],
aws_cognito_social_providers: [],
aws_cognito_signup_attributes: ["EMAIL"],
aws_cognito_mfa_configuration: "OPTIONAL",
aws_cognito_mfa_types: ["SMS"],
aws_cognito_password_protection_settings: {
passwordPolicyMinLength: 8,
passwordPolicyCharacters: [],
},
aws_cognito_verification_mechanisms: ["EMAIL"],
});

function MyApp({Component, pageProps}: AppProps) {
return <Component {...pageProps} />;
}

// export default withAuthenticator(MyApp);
export default MyApp;
"""

What I changed:
Before: export default withAuthenticator(MyApp);
After: export default MyApp;

While changing the _app.tsx break my build?

0 replies

Frankjunyulin · 2023-03-28T02:08:36Z

Frankjunyulin
Mar 28, 2023
Author

I also tried "remove .next", but still not working

0 replies

JesseKoldewijn · 2023-03-30T13:15:00Z

JesseKoldewijn
Mar 30, 2023

@Frankjunyulin
One: Please add the repo or some way for use to reproduce this issue.
Two: Please use three backticks before and after sending code so we could read the said code without us having to dig through it for 3 times the time it should take. (The backtick is most commonly located on the same key as the '~' sign). Cuz as you may have noticed, adding double quotes around your code doesn't preserve any formatting.

Example:

const someRandomComponent = () => {
   const someString = "Some string";
   return (<>Hello, {someString}</>);
}

0 replies

dimaver6work · 2024-06-02T23:09:20Z

dimaver6work
Jun 2, 2024

Does somebody have answer?
I have the same problem

TypeError: (0 , i.jsxDEV) is not a function
at p (/Users/dimaver6/Desktop/etalon/.next/server/pages/_app.js:1:833)
at Wc (/Users/dimaver6/Desktop/etalon/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js:68:44)

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

npm build error with react #47755

{{title}}

Replies: 5 comments

{{title}}

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

Select a reply

npm build error with react #47755

Frankjunyulin Mar 27, 2023

Verify canary release

Provide environment information

Which area(s) of Next.js are affected? (leave empty if unsure)

Link to the code that reproduces this issue

To Reproduce

Describe the Bug

Expected Behavior

Which browser are you using? (if relevant)

How are you deploying your application? (if relevant)

Replies: 5 comments

JuliusGudni Mar 27, 2023

Frankjunyulin Mar 28, 2023 Author

Frankjunyulin Mar 28, 2023 Author

JesseKoldewijn Mar 30, 2023

dimaver6work Jun 2, 2024

Frankjunyulin
Mar 27, 2023

JuliusGudni
Mar 27, 2023

Frankjunyulin
Mar 28, 2023
Author

Frankjunyulin
Mar 28, 2023
Author

JesseKoldewijn
Mar 30, 2023

dimaver6work
Jun 2, 2024