[Vue.js Error] 'index' is defined but never used.

안녕하세요, 주인장입니다. 오늘은 Vue.js에서 'index' is defined but never used. 오류에 대하여 살펴볼 예정입니다. 이 오류는 ESLint와 관련이 있는데, 여러가지 해결 방법이 있습니다.

먼저 Lint는 보푸라기라는 뜻인데 에러가 있는 코드에 표시를 달아놓는 것을 의미합니다. 즉 ESLint는 자바스크립트 문법 중 에러가 있는 곳에 표시를 달아놓는 도구를 의미합니다.

첫 번째, 불필요한 매개변수를 제거한다.

<template v-for="(item,index) in filltered_list" :key="item.id">
        <ListItem
          @click="() => showBooth(item.id)"
          :title="item.title"
          :content="item.content"
          :image="item.image"
          :type="item.type"
          imageAlt="이미지"
        />
      </template>

index에 대한 매개변수를 제거해주면 1차적으로 해결됩니다.

두 번째, 오류 부분 위에 eslint 처리

//eslint-disable-next-line no-unused-vars
오류 부분

세 번째, vue.config.js 파일 생성 후 삽입

module.exports = {
  devServer: {
    //본인의 코드
  }
}

해당 파일에 위의 코드를 삽입하면 된다.