Get an error saying cannot import next/document outside of _document even though it is in _document

What version of Next.js are you using?

11.1.2

What version of Node.js are you using?

16.6.1

What browser are you using?

Chrome

What operating system are you using?

Windows

How are you deploying your application?

next start

Describe the Bug

When running next lint I get the following output.

yarn run v1.22.10
$ next lint --fix
info  - Loaded env from E:\Developing\Ansen\Recode\.env
info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5

./src/pages/_document.tsx
1:1  Error: next/document should not be imported outside of pages/_document.js. See https://nextjs.org/docs/messages/no-document-import-in-page.  @next/next/no-document-import-in-page

info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules

Expected Behavior

It should not be giving the error as the import IS inside _document

To Reproduce

Create a _document.tsx file in src/pages/, have an import for next/document, e.g import Document, { Head, Html, Main, NextScript } from 'next/document';

run next lint

[nbouvrette]

I was about to open this issue - got the same problem 😃

[housseindjirdeh]

This is likely related to #28596. Is eslint-config-next (or @next/eslint-plugin-next) installed with version 11.1.3-canary.7 or later? If not, upgrading it and then clearing the cache (next lint --no-cache) should fix this issue.