WebStorm의 Live Edit 기능 사용

Live Edit 기능이란?



HTML/CSS 등을 디버깅 할 때 브라우저를 자동으로 다시로드하는 기능



Live Editing of HTML, CSS, and JavaScript
htps //w w. 지 tb 라이언 s. 이 m / 헤일프 / 우에 bs와 rm / 2016. HTML

환경


  • MacOS X El Capitan: 10.11.4
  • WebStorm: 2016.1

  • 설정 방법



    Chrome Extension 설치



    htps // ch 로메. 오, ぇ. 이 m / ぇ bs 잡아라 / 싶다 l / ぇ tb 라이언 s .

    이것만으로도 OK

    자세한 설정 등은 공식 페이지

    확인



    적절한 프로젝트를 열고 Chrome을 시작합니다. 브라우저 측에서 디버깅용 탭 열기



    디버깅 실행



    그리고는 에디터 측에서 편집할 때마다 브라우저 측도 다시 그려진다


    잘 작동하지 않는 경우



    Live Edit 기능이 유효한지 확인


    Preferences -> Editor -> Plugins 와 추적하고 LiveEdit 에 체크 박스가 들어 있는지 확인합시다.

    좋은 웹페이지 즐겨찾기