How can I fix jsx-a11y/anchor-is-valid when using the Link component in React?

Question

In a React app

Person Link

results in the following eslint error

The href attribu

Answer 1

The Link component generates href attribute so in the end anchor tag is valid from the accessibility point of view. Add an exception to .eslintrc:

{
  "rules": {
    "jsx-a11y/anchor-is-valid": [ "error", {
      "components": [ "Link" ],
      "specialLink": [ "to" ]
    }]
  }
}

Additionally, there is the same issue with a answer on GitHub.