"Module not found: Can't resolve" when using App router but works without error for Pages Router

[mmo80]

Link to the code that reproduces this issue

https://github.com/mmo80/nextjs-isolated

To Reproduce

initiate a new next project with App Router with npx create-next-app@latest
and another in a separate folder with Pages Router with npx create-next-app@latest

then do pnpm install and then pnpm install isolated-vm on both projects.

In the App Router project add a new api route (/api)
route.ts

import { NextResponse } from 'next/server';
import { Isolate } from 'isolated-vm';
import type IsolatedVM from 'isolated-vm';

export async function POST() {
  const isolate: IsolatedVM.Isolate = new Isolate({ memoryLimit: 128 });
  return NextResponse.json({ message: `isolated-vm` });
}

and in the Pages Router project add a new api route (/api)
test.ts

import type { NextApiRequest, NextApiResponse } from 'next';
import { Isolate } from 'isolated-vm';
import type IsolatedVM from 'isolated-vm';

type Data = {
  message: string;
};

export default async function handler(req: NextApiRequest, res: NextApiResponse<Data>) {
  const isolate: IsolatedVM.Isolate = new Isolate({ memoryLimit: 128 });
  res.status(200).json({ message: 'John Doe' });
}

Current vs. Expected behavior

On building the Pages Router project with pnpm run build all builds successful and the endpoint /api/test responds as expected. (when running pnpm run dev)

But when building the App Router project with pnpm run build i get the following error

  ▲ Next.js 14.2.3

   Creating an optimized production build ...
Failed to compile.

./node_modules/.pnpm/isolated-vm@4.7.2/node_modules/isolated-vm/isolated-vm.js
Module not found: Can't resolve './out/isolated_vm'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./src/app/api/route.ts


> Build failed because of webpack errors
 ELIFECYCLE  Command failed with exit code 1.

and the same error occurs when i call the api endpoint /api. (when running pnpm run dev)

is there a reason for this? is it as expected or is this a bug of some sorts?

Provide environment information

Operating System:
Windows 11

Binaries:
pnpm: 9.1.0
node: v20.13.0

Relevant Packages:
next: 14.2.3
isolated-vm: 4.7.2

Which area(s) are affected? (Select all that apply)

Runtime

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local)

Additional context

No response

[lucivaldo]

I also have a very similar error.

node@48c42faf6f2b:~/my-project$ yarn install
yarn install v1.22.19
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
warning "notistack > goober@2.1.14" has unmet peer dependency "csstype@^3.0.10".
[4/4] Building fresh packages...

success Saved lockfile.
Done in 95.69s.
node@48c42faf6f2b:~/my-project$ yarn build
yarn run v1.22.19
$ next build
Attention: Next.js now collects completely anonymous telemetry regarding usage.
This information is used to shape Next.js' roadmap and prioritize features.
You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
https://nextjs.org/telemetry

  ▲ Next.js 14.2.3
  - Environments: .env

   Creating an optimized production build ...
Failed to compile.

./src/app/users/components/Content.tsx
Module not found: Can't resolve '@/components/ui'

https://nextjs.org/docs/messages/module-not-found

./src/app/users/components/TabsContent/users.tsx
Module not found: Can't resolve '@/components/ui'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./src/app/users/components/Content.tsx

./src/app/users/components/TabsContent/Buildings.tsx
Module not found: Can't resolve '@/components/ui'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./src/app/users/components/Content.tsx

./src/app/users/hooks/useUsersQuery.ts
Module not found: Can't resolve '@/config/myAppApiConfig'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./src/app/users/components/TabsContent/users.tsx
./src/app/users/components/Content.tsx

./src/app/users/hooks/useUsersQuery.ts
Module not found: Can't resolve '@/errors/RequestError'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
./src/app/users/components/TabsContent/users.tsx
./src/app/users/components/Content.tsx


> Build failed because of webpack errors
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Environment information

node: v20.13.0
next: 14.2.3