nx: autogenerated type import path fails during build on nextjs 13 app directory, not finding layout file

Current Behavior

Expected Behavior

Build successfully without errors.

Github Repo

No response

Steps to Reproduce

All I need to do to reproduces it is to enable app dir:

in a NextJS project.

While running nx serve my-next, the appDir works fine, when running nx build my-next, the error above happens.

I can see the file generated during the build process that is dealing with types has a wrong path:

Nx Report

$ nx build my-next

> nx run my-next:build:production

warn  - You have enabled experimental feature (appDir) in next.config.js.
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
info  - Thank you for testing `appDir` please leave your feedback at https://nextjs.link/app-feedback

info  - Creating an optimized production build  
info  - Compiled successfully
info  - Skipping linting
info  - Checking validity of types ..Failed to compile.

Type error: Cannot find module '../../../../app/layout' or its corresponding type declarations.


 ——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

 >  NX   Ran target build for project my-next (2s)
 
    ✖    1/1 failed
    ✔    0/1 succeeded [0 read from cache]
 
   View structured, searchable error logs at https://nx.app/runs/lWgLCc4scB

Failure Logs

No response

Additional Information

Just a very basic @nrwl/next project, with appDir enabled, fails on build.

About this issue

Original URL
State: closed
Created a year ago
Reactions: 13
Comments: 17 (6 by maintainers)

Commits related to this issue

Use full path for the typescript plugin appDir generated import https://github.com/nrwl/nx/issues/14558 — committed to ianldgs/next.js by deleted user a year ago
Use full path for the typescript plugin appDir generated import Refs: nrwl/nx#14558 — committed to ianldgs/next.js by deleted user a year ago
Use full path for the typescript plugin appDir generated import Refs: nrwl/nx#14558 — committed to ianldgs/next.js by deleted user a year ago
Fix relative import path for type plugin in NX workspaces Refs: #44363, nrwl/nx#14558 — committed to ianldgs/next.js by deleted user a year ago
Fix relative import path for type plugin in NX workspaces Refs: #44363, nrwl/nx#14558 — committed to ianldgs/next.js by deleted user a year ago
Fix relative import path for type plugin in NX workspaces Refs: #44363, nrwl/nx#14558 — committed to ianldgs/next.js by deleted user a year ago
Fix relative import path for type plugin in NX workspaces Refs: #44363, nrwl/nx#14558 — committed to ianldgs/next.js by deleted user a year ago
Fix type plugin for NX workspaces (#47534) The plugin was failing in NX monorepos due to a wrong import path. #44363, https://github.com/nrwl/nx/issues/14558 ``` nx build my-next > nx run m... — committed to vercel/next.js by ianldgs a year ago

Most upvoted comments

I came across this behavior as well. The issue seems to be related to Next.js adding the types directory, that is created during build, to the tsconfig, which then cannot be resolved.

Workaround The type error does not occur when the build directory is inside the Next.js app directory itself. This can be changed in the project.json config by modifying the outputPath of the build target:

"targets": {
  "build": {
    "executor": "@nrwl/next:build",
    "outputs": ["{options.outputPath}"],
    "defaultConfiguration": "production",
    "options": {
      "root": "apps/next-app",
-      "outputPath": "dist/apps/next-app"
+      "outputPath": "apps/next-app/dist"
    },
  },

Fetten on Feb 1, 2023

It looks like NX is not supporting NextJS 13, since no one in the entire world can use nx build my-app.

Does anyone know if NX is planning to support Next 13 any time soon or is it back to Next 12 for production?

marianzburlea on Feb 15, 2023

I’ve made a temporary fix for next@13.1.6, which is still compatible with NX in case anyone wants to try out appdir.

  "pnpm": {
    "overrides": {
      "next": "npm:@ian-patches/next@13.1.6-patch-1"
    }
  }

ianldgs on Mar 4, 2023

we need a permanent solution instead of playing with project.json. so lets keep eyes on https://github.com/vercel/next.js/issues/44363

2coo on Apr 1, 2023

Also encountering this issue, should have checked GH earlier instead of waisting hours of headaches 😃

Jordaneisenburger on Mar 30, 2023

Opened a PR in next to fix it. Also released a patch for 13.2.4:

  "pnpm": {
    "overrides": {
      "next": "npm:@ian-patches/next@13.2.4-patch-2"
    }
  }

ianldgs on Mar 25, 2023