Angular 9 시리즈(10)는 vconsole과 eruda 개발자용 디버깅 패널을 내장합니다

작은 쓰레기 같은 놈들 · 2020-6-29 16:26:06에 게시됨

Angular 9 시리즈 (1) 동적 부하 구성 요소
https://www.itsvse.com/thread-9238-1-1.html

Angular 9 시리즈(2) 동적 성분 전송 매개변수
https://www.itsvse.com/thread-9245-1-1.html

Angular 9 시리즈(3)는 동적 컴포넌트 이벤트를 구독합니다
https://www.itsvse.com/thread-9246-1-1.html

Angular 9 시리즈 (IV) 맞춤형 파이프 파이프라인
https://www.itsvse.com/thread-9248-1-1.html

Angular 9 시리즈(V)는 금액 통화 형식을 제공합니다
https://www.itsvse.com/thread-9249-1-1.html

Angular 9 시리즈(VI)는 네이티브 JS 변수와 메서드를 호출합니다
https://www.itsvse.com/thread-9254-1-1.html

Angular 9 시리즈 (VII) CSS 스타일 스코프
https://www.itsvse.com/thread-9264-1-1.html

Angular 9 시리즈(VIII)는 집합을 통해 이벤트를 트리거하여 자식 컴포넌트의 값을 업데이트합니다
https://www.itsvse.com/thread-9267-1-1.html

Angular 9 시리즈 (9) #id 선택기가 페이지에 적용됨
https://www.itsvse.com/thread-9278-1-1.html

PC 쪽에서 웹사이트에 접속하려면 F12를 누르면 브라우저를 통해 디버깅 도구를 열어 출력 로그, 네트워크 요청, 웹페이지 요소, 쿠키 및 기타 정보를 확인할 수 있습니다.

하지만 모바일이나 미니 프로그램, 앱을 개발할 때는 비정상적인 문제가 발생하여 비정상적인 정보를 직접 볼 수 없습니다.
순수 html 웹 페이지 튜토리얼:

[프론트엔드 필수] 개발자 디버깅 패널
https://www.itsvse.com/thread-9285-1-1.html

이 글에서는 Angular 9 프로젝트에 프론트엔드 개발자용 디버그 패널 두 개를 삽입할 것을 권장합니다.

먼저 렌더링을 살펴보겠습니다:

v콘솔

모바일 웹페이지를 위한 가볍고 확장 가능한 프론트엔드 개발자 디버깅 패널입니다.

튜토리얼은 다음과 같습니다. npm 설치 플러그인을 다음과 같이 실행하세요:

로그인이 보이네요.

구성 요소에서 도입되었습니다

로그인이 보이네요.

호출

로그인이 보이네요.

하이퍼링크 로그인이 보입니다.

에루다

Eruda는 모바일 웹 페이지 프론트엔드용으로 설계된 디버깅 패널로, DevTools의 미니 버전과 유사합니다. 콘솔 로그 캡처, 요소 상태 확인, XHR 요청 캡처, 로컬 저장소 및 쿠키 정보 표시 등 주요 기능을 갖추고 있습니다.

튜토리얼은 다음과 같습니다. npm 설치 플러그인을 다음과 같이 실행하세요:

로그인이 보이네요.

구성 요소에서 도입되었습니다

로그인이 보이네요.

호출

로그인이 보이네요.

하이퍼링크 로그인이 보입니다.

(끝)

작은 쓰레기 같은 놈들 · 2022-1-25 13:12:03에 게시됨

vConsole direct js ingestion

로그인이 보이네요.

초기화

로그인이 보이네요.

[각] Angular 9 시리즈(10)는 vconsole과 eruda 개발자용 디버깅 패널을 내장합니다

관련 게시물

본 섹션