【Vue.js】Vue.js devtools를 표시 할 수 없을 때에 본다

vue.js 비망록, 제2탄.
누군가의 도움이 되시면 다행입니다.

Vue.js devtools란 무엇입니까?

Vue 디버깅을 할 때 매우 유용한 확장 기능입니다.
컴퍼넌트 구조를 직감적 조작으로 확인할 수 있어, 프로퍼티의 내용도 볼 수가 있습니다.

도입 방법은 매우 간단하고 여기 에서 다운로드 하기만 하면 됩니다.

올바른 움직임

확인에서 개발자 도구를 열고 Vue 탭이 표시되면 OK

Vue 탭이 표시되지 않는 패턴①

'파일 URL에 대한 액세스 허용'이 꺼져 있으면 사용해 봅시다.

Vue 탭이 표시되지 않는 패턴②

당연하지만 production 모드에서는 표시되지 않습니다.
개발 모드로 확인해 봅시다.

Vue 탭이 표시되지 않는 패턴③

여기까지 보아도 Vue 탭이 나오지 않았다면 캐시를 의심합니다.
Network 탭의 Disable cache를 체크하고 다시 로드하여 개선할 것인지 확인해 보세요.



이제 대략 해결할 수 있어야합니다 m (__) m