최대 1 분 소요

enter image description here

에러: The href attribute requires a valid value to be accessible.

//예제1
src\components\Header.js
  Line 9:9:   The href attribute requires a valid value to be accessible. Provide a valid, navigable address as the href value. If you cannot provide a valid href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-is-valid.md         jsx-a11y/anchor-is-valid
//예제2
<NavMenu>
  <a href="">
    <img src="./images/home-icon.svg" alt="~" />
    <span>HOME</span>
  </a>
  <a href="">
    <img src="./images/search-icon.svg" alt="~" />
    <span>SEARCH</span>
  </a>
  <a href="">
    <img src="./images/watchlist-icon.svg" alt="~" />
    <span>WATCHLIST</span>
  </a>
  <a href="">
    <img src="./images/original-icon.svg" alt="~" />
    <span>ORIGINALS</span>
  </a>
  <a href="">
    <img src="./images/movie-icon.svg" alt="~" />
    <span>MOVIES</span>
  </a>
  <a>
    <img href="" src="./images/series-icon.svg" alt="~" />
    <span>SERIES</span>
  </a>
</NavMenu>

해결책

해결책은 간단합니다.

href = "!#";

이렇게 변경해주시면 됩니다.

댓글남기기