[Vue] Component name "index" should always be multi-word vue/multi-word-component-names 오류

 뷰 프로젝트가 며칠 전에는 멀쩡하게 돌아갔었는데 갑자기 오류가 발생하면서 npm run serve 명령어를 할 때마다 fail이 뜨게 되었다. 오류에 대한 내용들은 아래와 같았다.

 

Component name "index" should always be multi-word vue/multi-word-component-names

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.

 

 그런데 VSCode는 위와 같이 eslint를 무시하는 명령어를 쓰라 해서 그러기 싫어서 이것 저것 찾아보았지만.. 해결하 수 없었고.. 결국 같이 스터디하시는 선배님이 알려주셔서 해결하게 되었다. 

 

 해결 방법은 

1. VSCode 내부에서 [View] -> [Command Platte..] -> JSON 검색 ->  Preferences: Open Settings(JSON) 선택

 

2. 내부에 아래 소스 코드 입력

{
	"eslint.workingDirectories": [ { "mode": "auto" } ],
}

 

3. 하고 npm run serve하면 돌아가면 해당 문제 때문에 발생한 것이고 아니면 추가 작업을 더 해주어야 한다.

 

4. vue.config.js에서 module.exports 내부에 아래 소스 코드를 넣어주면 해결된다. npm run serve로 확인하면 된다.

lintOnSave:false