Chrome 개발자 도구에서 특정 파일로 이동하는 방법은 무엇입니까?


98

무거운 프런트 엔드 접근 방식으로 웹 응용 프로그램을 개발 중입니다. Dojo와 AMD-way를 사용함으로써 저는 현재 수백 개의 다른 자바 스크립트 파일을 쉽게로드 할 수있는 테스트 화면을 가지고 있습니다.

특정 문제를 디버깅하거나 특정 파일의 이전 버전이 표시되는지 확인하고 싶을 때 Chrome 개발자 도구의 소스 탭에서 내 파일을 찾기가 정말 어렵습니다.

파일 이름을 입력하고 해당 파일의 소스로 이동할 수있는 바로 가기 나 작업이 있습니까?


2
콘솔 오른쪽 하단에 기어 아이콘이 있습니다. 클릭하세요. 설정 창의 마지막 탭에는 바로 가기 탭이 있습니다. 답과 같은 키 콤보를 볼 수 있습니다.
epascarello 2013 년

구글 개발 도구의 사용 '파일 이동'(CSS, ...에서 함수 이름에 능력 검색, 클래스 이름을 가진 유연하고 유용한 도구) 구글 개발 도구에서 '파일 이동'
이만 Bahrampour

답변:


142

소스 탭 사용하는 동안 CTRL+ O( + O파일 이름에 의해 스크립트, 스타일 시트 및 조각을 검색 할 수있는 Mac 용).

( 파일을 볼 때 CTRL+ SHIFT+ O를 사용 하여 JavaScript 함수 / CSS 규칙으로 필터링 / 탐색)

[ Chrome Devtools Cheatsheet ]


알아두면 좋습니다! 당신은 (Chrome 35 이전에?) 소스 탭에서 파일 탐색기로 입력하여 파일 이름 검색을 시작할 수있었습니다. 이 기능을 완전히 제거하는 대신 바로 가기 뒤에 숨겼다는 사실을 아는 것이 좋습니다. =)
rakslice 2014-06-17

필터 / 검색에 대한주의 사항은 정확한 검색이나 와일드 카드를 수행 할 수 없다는 것입니다. 검색은 .js파일 이름에 a j또는 an s또는 a .가있는 모든 파일 을 반환합니다 . : /
worc aug

15

CTRL+ PWindows에서 검색 입력을 불러옵니다.

여기에 이미지 설명 입력

+ P— Mac에서.

여기에 이미지 설명 입력


2
OP동일한 동작을 갖고있는 것 같다. 하나가 더 이상 사용되지 않는지 궁금합니다.
isherwood

3

Windows에서 :

CTRL+ SHIFT+ F 를 사용 하여 파일의 콘텐츠를 검색합니다.

CTRL+ SHIFT+ O 를 사용 하여 파일 이름을 검색합니다.


빌드 프로세스를 사용하고 파일이 더 이상 크롬에서 인식되지 않는 경우 콘텐츠로 검색하는 것이 훌륭한 솔루션입니다.
Mote Zart

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.