Middleware won't deploy in subpath with error no-server-import-in-page with React Server Components and concurrentFeatures

What version of Next.js are you using?

12.0.8-canary.4

What version of Node.js are you using?

local: 14.8.1 // vercel: 12

What browser are you using?

Chrome

What operating system are you using?

macOS

How are you deploying your application?

Vercel

Describe the Bug

When deploying an NextJs App to Vercel, with having a _middleware.js / _middleware.ts in a sub-path of pages, e.g. /pages/dashboard/_middleware.ts the build fails with: Error: next/server should not be imported outside of pages/_middleware.js. See https://nextjs.org/docs/messages/no-server-import-in-page. @next/next/no-server-import-in-page

Expected Behavior

Deploy sucessfully

To Reproduce

With: concurrentFeatures: true serverComponents: true

Add: /pages/test/_middleware.js

import { NextResponse } from "next/server";

export default async function middleware(req, event) {
  return NextResponse.next();
}

[balazsorban44]

@thibautsabot is totally right.

This has been fixed in eslint-config-next@12.0.8-canary.0. Make sure you have that or a newer version!

[thibautsabot]

Hey!

Really sorry about the hiccup 🙏 .

I’m unable to reproduce it with next and eslint-config-next on 12.0.8-canary.5 though 😕 . Did you update both packages?