Default Next.js app fails to build in brand new workspace

[tundera]

Current Behavior

After creating a new Nx workspace with a Next.js application, the Next.js app fails to build even though no changes have been made to the app.

Expected Behavior

Builds should succeed for new, unchanged Next.js apps in a freshly generated workspace.

Steps to Reproduce

Here's a reproduction of the issue using Codesandbox. The Next.js app will run fine in the sandbox, but opening a new terminal window and attempting to build to will result in an error.

Failure Logs

Environment

 >  NX   Report complete - copy this into the issue template

   Node : 16.14.0
   OS   : darwin x64
   yarn : 1.22.17
   
   nx : 13.10.1
   @nrwl/angular : Not Found
   @nrwl/cypress : 13.10.1
   @nrwl/detox : Not Found
   @nrwl/devkit : 13.10.1
   @nrwl/eslint-plugin-nx : 13.10.1
   @nrwl/express : Not Found
   @nrwl/jest : 13.10.1
   @nrwl/js : 13.10.1
   @nrwl/linter : 13.10.1
   @nrwl/nest : Not Found
   @nrwl/next : 13.10.1
   @nrwl/node : Not Found
   @nrwl/nx-cloud : 13.2.2
   @nrwl/nx-plugin : Not Found
   @nrwl/react : 13.10.1
   @nrwl/react-native : Not Found
   @nrwl/schematics : Not Found
   @nrwl/storybook : 13.10.1
   @nrwl/web : 13.10.1
   @nrwl/workspace : 13.10.1
   typescript : 4.6.3
   rxjs : 6.6.7
   ---------------------------------------
   Community plugins:

Done in 0.77s.

[gioragutt]

Idk if this is related, I saw there might be a version mismatch between react and types/react after the react18 migration, perhaps this is the cause?
Could you check your package json versions of react packages?

[vincent-thomas]

I think the error may be in the tsconfig.json. change jsx-transpilation to preserve or react-jsx

[rldnrl]

I also got an error in the same part. This is because the @types/react and @types/react-dom versions are not updated.

My Solution

I manually updated to fix this issue.

[tundera]

@rldnrl Yep, this is what will fix the issue. Just upgrade the @types/react and @types/react-dom versions to latest and the build succeeds. So the fix should be to update the templates to use the new types packages for react and react-dom. It looks like this will be addressed in #9767

[ndcunningham]

Should be fixed with: #9767

If the problem still persist please feel free to open

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.