Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

When I import next/server in pages/api/_middleware.ts, always violate no-server-import-in-page #32586

Closed
nabi-chan opened this issue Dec 16, 2021 · 3 comments
Labels
bug Issue was opened via the bug report template.

Comments

@nabi-chan
Copy link

nabi-chan commented Dec 16, 2021

What version of Next.js are you using?

12.0.6 (latest)

What version of Node.js are you using?

14.17.3

What browser are you using?

chrome, safari, firefox

What operating system are you using?

macOS

How are you deploying your application?

next dev

Describe the Bug

When I create a middleware.js file in a folder over 1 depth in pages (e.g pages/api)
and import next/server there, eslint informs me that I violated 'no-server-import-in-page' (picture 1)
But when I create middleware on pages/ these error doesn't shown. (picture 2)

P.S. If I must be import next/server right under the pages/, please let me know.

pages/api/my/_middleware.js

image

pages/_middleware.js

image

Expected Behavior

Errors aren't displayed when import next/server regardless depth in pages/**

To Reproduce

.eslintrc.json

{
  "extends": ["next/core-web-vitals", "plugin:prettier/recommended"],
    "rules": {
      "@next/next/no-img-element": "off",
      "import/no-anonymous-default-export": "off"
    }
}

/pages/_middleware.js

// this file doesn't shown error
import { NextResponse } from "next/server";

export function middleware(req) {
  if (!req.headers.get("
    return new Response("unauthorized", {
      status: 401,
    });
  }

  NextResponse.next();
}

/pages/api/_middleware.js

// next/server should not be imported outside of pages/_middleware.js.
// See https://nextjs.org/docs/messages/no-server-import-in-page.
import { NextResponse } from "next/server";

export function middleware(req) {
  if (!req.headers.get("
    return new Response("unauthorized", {
      status: 401,
    });
  }

  NextResponse.next();
}
@nabi-chan nabi-chan added the bug Issue was opened via the bug report template. label Dec 16, 2021
@balazsorban44
Copy link
Member

balazsorban44 commented Dec 16, 2021

This has been fixed in the canary branch, please upgrade npm i next@canary or wait until it lands in stable.

Related PR: #32139

@adityar15
Copy link

it doesn't work. Event after running npm i next@canary.

My middleware is inside pages/dashboard/_middleware.js

@balazsorban44
Copy link
Member

Make sure to update eslint-config-next as well!

@vercel vercel locked as resolved and limited conversation to collaborators Jan 17, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Issue was opened via the bug report template.
Projects
None yet
Development

No branches or pull requests

3 participants