vue devtools 설치 및 사용 튜 토리 얼

1509 단어 vuedevtools
1.github 에서 압축 패 키 지 를 다운로드 하고 github 다운로드 주소:https://github.com/vuejs/vue-devtools
2.로 컬 의 어떤 판 에 압축 을 풀다.
3.이 폴 더 아래 npm 로 들 어가 기
4.순서대로 진다:
1:npm install
2:npm run build         (이 단 계 는 잊 지 마 세 요.이 단 계 를 실행 하지 않 으 면 프로젝트 폴 더 셸>chrome 폴 더 에 src 폴 더 가 하나 빠 집 니 다.다음 그림)
vue-devtools的安装与使用
5:셸>chrome 폴 더 의 mainifest.json 의 persistant 를 true 로 수정 합 니 다.
vue-devtools的安装与使用
6:구 글 브 라 우 저의 확장 프로그램 기능 을 찾 아 개발 자 모드 를 선택 한 다음 플러그 인 폴 더 의 셸>chorme 폴 더 를 페이지 에 직접 끌 어 다 놓 고 설 치 를 완료 합 니 다.
(메모:네 번 째 npm run build 를 실행 하지 않 으 면 배경 스 크 립 트"build/background.js"를 불 러 올 수 없습니다)
7:플러그 인의 디 렉 터 리 에서 npm run dev 를 실행 합 니 다.이 때 우리 의 플러그 인 은 실행 할 수 있 습 니 다.localhost:8080 을 열 면 플러그 인 이 설치 되 어 실행 되 고 있 는 것 을 볼 수 있 습 니 다.
vue-devtools的安装与使用
8:로 컬 의 다른 항목 을 열 때 vue-devtools 폴 더 에서 npm run dev 를 실행 할 필요 가 없습니다.이 플러그 인 은 브 라 우 저 에 설치 되 어 있 기 때 문 입 니 다.다음은 vue 프로젝트 를 즐겁게 디 버 깅 하 세 요.
총결산
위 에서 말 한 것 은 편집장 이 소개 한 vue devtools 의 설치 와 사용 튜 토리 얼 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.편집장 은 신속하게 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!

좋은 웹페이지 즐겨찾기