vue3 를 배우는 중인데, 강좌에서 권하는 대로 vscode/vetur 를 설치하고 나니 계속해서 아래 에러가 떴다.
The template root requires exactly one element
vue2 에서는 root div 태그가 필수적이었는데, vue3 로 넘어오면서 불필요한 root div 태그를 사용할 필요가 없게 되었다.
그런데 vetur 는 vue2 를 기본으로 인식하고 있어서 그런 문제가 발생한 것 같다.
두가지 방안이 있었다. vue2 도 자주 사용하는 경우 방법 1을, vue3 만 사용하는 경우 방법 2를 사용하면 될 것 같다. 나는 vue3 만 사용하기 때문에 방법 1을 하지 않고 방법 2 대로 했다.
stackoverflow 를 검색했을 때는 validation check 를 꺼주면 된다고 하는데 그럼 vetur 를 사용하는 의미가 약간 퇴색되지 않나 싶어서, vue3 를 정식으로 지원하는 다른 플러그인 volar 를 사용하기로 했다.
참고사이트
https://stackoverflow.com/questions/64867504/vue-3-the-template-root-requires-exactly-one-element-eslint-plugin-vue
http://romeoh.tistory.com/m/403