跳至内容
文档错误页面无 HTML 链接

页面无 HTML 链接

防止使用<a>元素导航到内部 Next.js 页面。

错误发生的原因

使用<a>元素导航到页面路由时未使用next/link组件，导致不必要的完整页面刷新。

Link组件是启用页面之间客户端路由转换并提供单页应用程序体验所必需的。

可能的解决方法

确保导入Link组件并包装导航到不同页面路由的锚元素。

之前

pages/index.js
function Home() {
  return (
    <div>
      <a href="/about">About Us</a>
    </div>
  )
}

之后

pages/index.js
import Link from 'next/link'
 
function Home() {
  return (
    <div>
      <Link href="/about">About Us</Link>
    </div>
  )
}
 
export default Home

选项

pagesDir

此规则通常可以自动找到您的pages目录。

如果您在使用单一仓库，我们建议在eslint-plugin-next中配置rootDir设置，pagesDir将使用它来查找您的pages目录。

在某些情况下，您可能还需要通过提供pages目录来直接配置此规则。这可以是路径或路径数组。

eslint.config.json
{
  "rules": {
    "@next/next/no-html-link-for-pages": ["error", "packages/my-app/pages/"]
  }
}