IT이야기

Safari용 vue-devtools 확장이 있습니까?

cyworld 2022. 6. 4. 08:13
반응형

Safari용 vue-devtools 확장이 있습니까?

Firefox와 Safari의 Vue 속성 중 하나(적어도)를 처리하는 방식이 일치하지 않습니다.그 안에 무엇이 있는지 확인할 수 있으면 매우 도움이 됩니다.감사합니다!

이제 vue-devtools 버전 전자 제품이 존재하며, 이는 모든 플랫폼에서 작동합니다.

npm install -g @vue/devtools

패키지를 글로벌하게 설치한 후 다음을 수행합니다.

vue-devtools

앱의 머리글에 추가

<script>
  window.__VUE_DEVTOOLS_HOST__ = '<your-local-ip>' // default: localhost
  window.__VUE_DEVTOOLS_PORT__ = '<devtools-port>' // default: 8098
</script>
<script src="http://<your-local-ip>:8098"></script>

safari에서 개발 앱을 엽니다.

localhost:3000

iPhone: localhost가 아닌 ip를 사용하고, iphone에서 활성화 디버깅 옵션을 사용하는 것은 iphone safari!와 함께 사용할 수 있으며, Mac에서 디버깅할 수 있습니다.

상세 정보 및 상세 정보

https://github.com/vuejs/vue-devtools/blob/master/shells/electron/README.md

현재 vuejs에 대한 공식적인 사파리 확장은 없습니다.그러나 해결 방법에 따라 safari에서 vue-devtools를 사용할 수 있습니다.

vue-devtools 복제

git clone https://github.com/vuejs/vue-devtools

라이브러리 설치 및 구축

 npm install   
 npm run build:safari

이제 Safari 브라우저를 열고 (메뉴바의 메뉴)로 이동합니다.

preferences -> Advanced -> Show Developer

Open Developer-> 확장 빌더 표시

왼쪽 아래에 있는 더하기 버튼을 클릭하고 확장 추가...를 선택합니다.

선택한다.shells/safari/Vue.jsdevtools.safariextension

[Web 사이트 액세스]-> [접근 수준]에서 [모두]를 선택합니다.

보안 보호된 웹 페이지 포함 체크

오른쪽 상단의 [Install]을 클릭합니다.

Github 링크


Chrome 사용자이고 Inspector에서 'Vue' 탭을 보는 데 익숙한 사용자는 Safari에 이러한 탭이 표시되지 않습니다.대신 Safari의 URL 표시줄: vue devtools inspector 위치 옆에 있는 확장 버튼을 클릭하면 이 보기를 찾을 수 있습니다.

언급URL : https://stackoverflow.com/questions/47833789/is-there-a-vue-devtools-extension-for-safari

반응형