Chrome Dev Tools - javascript 수정 및 새로고침
페이지의 JavaScript를 수정한 후 수정한 JavaScript 파일을 새로고침하지 않고 페이지를 새로고침할 수 있습니까(그 결과 수정이 손실됨)?
이것은 다소 회피책이지만, 조작하고 싶은 javascript 파일이나 블록의 선두에 브레이크 포인트를 추가하는 방법이 있습니다.
그런 다음 새로고침하면 디버거가 중단점에서 일시 중지되고 소스에 원하는 내용을 변경하고 파일을 저장한 다음 수정된 코드를 통해 디버거를 실행할 수 있습니다.
그러나 모두가 말했듯이 다음 새로고침에서는 변경사항이 사라집니다. 적어도 약간 수정된 JS 클라이언트 측을 실행할 수 있습니다.
좋은 소식입니다. 2018년 3월에 수정이 제공될 예정입니다. 다음 링크를 참조하십시오. https://developers.google.com/web/updates/2018/01/devtools
"로컬 재정의를 통해 DevTools를 변경하고 페이지 로드에 걸쳐 변경 내용을 유지할 수 있습니다.이전에 DevTools에서 변경한 내용은 페이지를 새로고침할 때 손실됩니다.로컬 재정의는 대부분의 파일 형식에서 작동합니다.
구조:
- DevTools가 변경 내용을 저장할 디렉토리를 지정합니다.DevTools에서 변경하면 DevTools는 수정된 파일의 복사본을 디렉토리에 저장합니다.
- 페이지를 다시 로드하면 DevTools는 네트워크 리소스가 아닌 수정된 로컬 파일을 제공합니다.
로컬 재정의를 설정하려면:
- 소스 패널을 엽니다.
- 재정의 탭을 엽니다.
- [ Setup Overrides ]을 클릭합니다.
- 변경 내용을 저장할 디렉토리를 선택합니다.
- 뷰포트 상단에서 [허용]을 눌러 DevTools에 디렉토리에 대한 읽기 및 쓰기 액세스 권한을 부여합니다.
- 변경하십시오."
업데이트(2018년 3월 19일):자세한 설명은 이쪽에서 보실 수 있습니다.https://developers.google.com/web/updates/2018/01/devtools#overrides
Resource Override 확장을 사용하면 다음과 같은 작업을 수행할 수 있습니다.
- 바꿀 URL에 대한 파일 규칙 생성
- 확장자 js/css/etc 편집
- 원하는 빈도로 새로고침:)
- devtools 기본 설정에서 Enable local overrides를 선택합니다.
- [ Network ]탭으로 이동하여 편집할 파일을 찾아 클릭하여 [Save for overrides]를 선택합니다([Source/Overrides]탭에서 로컬폴더를 추가해야 합니다).
- 파일이 소스 탭의 새 탭에 로컬 복사본으로 표시되므로 이 파일을 편집할 수 있습니다. 사이트 새로고침 후 새(및 편집된) 덮어쓰기 파일이 사이트에 로드됩니다.
정확한 질문(Chrome Developer Tools)에 대한 답변은 아니지만 이 회피책을 성공적으로 사용하고 있습니다.http://www.telerik.com/fiddler
(일부 웹 개발자는 이미 이 툴에 대해 알고 있을 것입니다.)
- 파일을 로컬로 저장하다
- 필요에 따라 편집
- 이익!
전문 문서: http://docs.telerik.com/fiddler/KnowledgeBase/AutoResponder
추신. 차라리 Chrome에 깃발처럼 구현해 주었으면 합니다.preserve after reload기업 네트워크상에서 포럼과 토론 그룹이 차단되어 있기 때문에, 지금으로서는 이 작업을 실시할 수 없습니다.
그래, 넌 쉽게 할 수 있어!소스 -> 파일 시스템 -> Conatainer 폴더 선택 -> 접근 허용 -> 파일을 열고 편집 및 저장합니다.https://www.delftstack.com/howto/javascript/edit-javascript-in-the-browser/
네, 개발 도구에서 "소스" 탭을 열고 변경할 스크립트로 이동합니다.개발 도구 창에서 직접 조정한 후 ctrl+s를 눌러 스크립트를 저장하십시오. 페이지 전체를 새로 고칠 때까지 새 js가 사용됨을 알 수 있습니다.
언급URL : https://stackoverflow.com/questions/16494237/chrome-dev-tools-modify-javascript-and-reload
'IT' 카테고리의 다른 글
| TIMESTAMP 열을 ZonedDateTime JPA 엔티티 속성에 매핑하려면 어떻게 해야 합니까? (0) | 2023.01.15 |
|---|---|
| SQL 쿼리에서 LEFT JOIN 순서를 정렬하는 방법 (0) | 2023.01.15 |
| 명령줄 mac에서 mysql에 액세스할 수 없습니다. (0) | 2023.01.15 |
| PHP 5: 지속 vs 정적 (0) | 2023.01.15 |
| 링크에 GET 대신 POST를 사용하다 (0) | 2023.01.15 |