Next.js Discord

Discord Forum

ESLint `no-html-link-for-pages` rule with app dir

Unanswered
Chien Français Blanc et Noir posted this in #help-forum
Open in Discord
Chien Français Blanc et NoirOP
Its been a while now that we've had stable app dir, I've been using it in production. Early on when I started this repo, I had to use the pages/ dir for only 1 route: pages/api/[...nextauth].ts, but since upgrading to the latest next-auth, I was able to migrate today into app/api/[...nextauth].ts which is great, but now I'm seeing a ton of logs in my Eslint output and when I run pnpm lint regarding no-html-link-for-pages on files.

I read the docs here https://nextjs.org/docs/messages/no-html-link-for-pages and confirmed I have NO anchor <a> links in my codebase. Secondly, I did some googlign and found other github issues but they all said about either ignoring the rule or setting the directory in the rule if you're using a monorepo.  I'm not using a mono repo, all my pages are in app/(app)/[page-name]/page.tsx or similar. and I also did try setting the route in the rule, that didnt change anything.

I also did try disabling the rule entirely. But when I do I get this error @next/next/no-page-custom-font pointing to a default file that I use for a fallback: app/(app)/@modal/(.)explore/default.tsx
That file currently has this content only
import React from 'react';

export default function Default() {
    return null;
}
And that was because I have to specify a default fallback for parallel route https://nextjs.org/docs/app/building-your-application/routing/parallel-routes#modals

Is this rule still broken as well as the no-page-custom-font or am I doing something wrong?

I'm using this config
"dependencies": {
 //...
 "@types/react": "19.0.2",
 "@types/react-dom": "19.0.2",
 "react": "19.0.0",
 "react": "19.0.0",
 //...
 "devDependencies": {
    "eslint": "8.36.0",
    "eslint-plugin-import": "^2.29.1",
    "tsx": "^4.19.2"
  },
  "pnpm": {
    "overrides": {
      "@types/react": "19.0.2",
      "@types/react-dom": "19.0.2"
    }
  },

Node: 22

1 Reply

Chien Français Blanc et NoirOP
Resolved by
Upgrading from ESlint v8 to v9 and updating config file to use new format: https://eslint.org/docs/latest/use/configure/configuration-files
https://eslint.org/docs/latest/use/configure/migration-guide
Updating to use eslint/js and eslint/eslint
+ @eslint/eslintrc ^3.2.0
+ @eslint/js ^9.17.0

Setting rules to off
"@next/next/no-html-link-for-pages": "off",
"@next/next/no-page-custom-font": "off",

Downgrading to Node 20
And restarting eslint server in VSCode/Cursor