WebStorm 입문용 요약-webstorm-php.cn

이 기사는 WebStorm의 입문용 요약을 공유합니다. 내용에는 특정 참고 가치가 있습니다. 도움이 필요한 친구가 도움이 되기를 바랍니다.

WebStorm은 JetBrains가 15년 넘게 개발하고 개선해 온 오픈 소스 IntelliJ 플랫폼을 기반으로 구축되었습니다. 널리 사용되는 여러 버전 제어 시스템과 작동하는 통합 UI를 제공하여 git, GitHub, SVN, Mercurial 및 Perforce 전반에서 일관된 사용자 경험을 보장합니다. WebStorm은 바로가기, 글꼴, 시각적 테마부터 도구 창 및 편집기 레이아웃에 이르기까지 코딩 스타일에 완벽하게 맞도록 조정하여 사용자 정의 가능한 기능을 제공합니다.

지능형 코딩 지원

WebStorm은 훌륭한 코드를 작성하는 데 도움이 됩니다. 스마트 편집기에는 코드 완성, 동적 코드 분석, 코드 형식 지정 및 리팩토링 기능이 있어 생산성을 높이고 개발 경험을 완전히 새로운 수준으로 끌어올릴 수 있습니다.

지원되는 언어 및 프레임워크

WebStorm은 JavaScript, ECMAScript 6, TypeScript, CoffeeScript, Dart 및 Flow에 대한 동급 최고의 코딩 도움말을 제공합니다.

WebStorm을 사용하면 HTML, CSS, Less, Sass 및 Stylus 코드를 작성할 수 있습니다.

무엇보다도 Node.js와 React, Angular, Vue.js, Meteor 등과 같은 널리 사용되는 프레임워크에 대한 고급 지원 혜택을 누릴 수 있습니다.

코드 인텔리전스 지원

WebStorm은 프로젝트를 분석하여 애플리케이션에 정의된 모든 메서드, 함수, 모듈, 변수 및 클래스에 대해 최상의 코드 완성 결과를 제공합니다. 코딩 지원은 상황을 인식하며 프레임워크별로 지원될 수도 있습니다.

WebStorm에서 CSS로 작업할 때 속성 및 해당 값에 대한 코드 완성을 즐겨보세요. Less와 Sass에서는 믹스인의 도움을 받으세요. 물론 HTML에서는 모든 태그와 속성에 대한 코드 완성 기능을 얻을 수 있습니다.

코드 품질 분석 및 감지

WebStorm에는 지원되는 모든 언어에 대한 수백 가지 검사가 내장되어 있습니다. 이 외에도 ESLint, TSLint, Stylelint, JSCS, JSHint 및 JSLint를 사용할 수도 있습니다.

WebStorm 편집기는 사용자가 입력하는 즉시 모든 오류와 경고를 보고하고 다양한 빠른 수정 옵션을 제공합니다.

WebStorm 문제가 있을 수 있는 코드 줄은 올바른 편집기 여백에 표시되므로 긴 파일에서 오류와 경고를 쉽게 찾아낼 수 있습니다.

WebStorm을 사용하여 전체 프로젝트에 대한 코드 품질 분석을 실행하고 선택한 빠른 수정 사항을 자동으로 적용할 수도 있습니다.

webstorm 사용 팁

WebStorm 테마(글꼴 및 색상) 변경 방법:
파일 -> > 편집기 -> 색상&글꼴 -> 테마 다운로드 주소
시작 시 웹스톰이 프로젝트 파일을 열지 못하게 하는 방법:
파일 - > 설정- >일반 제거 시작 시 마지막 프로젝트를 다시 엽니다.
WebStorm 중국어를 완벽하게 표시하는 방법:
파일 ->설정 기본 글꼴 재정의(권장하지 않음)를 선택하고 이름: NSimSun, 크기: 12
WebStorm이 줄 번호를 표시하는 방법:
File -> ->편집기, "줄 번호 표시"를 선택하여 줄 번호를 표시합니다.
WebStorm 코드를 자동으로 줄 바꿈하는 방법:
파일 -> > Editor "Use Soft Wraps in editor"가 선택되어 있으면 코드가 자동으로 래핑됩니다.
이 줄 끝에 WebStorm을 표시하는 방법:
파일 -> 설정 -> 편집기 "줄 끝 뒤에 캐럿 배치 허용"을 선택 취소할 수 있습니다.
WebStorm 단축키 수정 방법:
파일 ->설정->키맵을 선택한 다음 단축키를 수정하려는 기능을 두 번 클릭하고 프롬프트 상자가 나타납니다.
WebStorm을 익숙한 편집기의 단축키로 바꾸는 방법:
파일 ->설정-> Keymap은 Visual Studio, Eclipse, NetBeans 및 기타 주류 IDE를 지원합니다.
javascript 라이브러리 팁.
파일 -> 설정 -> 자바스크립트 -> 라이브러리 -> 그런 다음 목록에서 자주 사용하는 자바스크립트 클래스 라이브러리를 선택하고 마지막으로 다운로드하고 설치하면 됩니다.
WebStorm에서 js를 개발할 때 후보 옵션을 선택하려면 Ctrl + Return이 필요하다는 것을 알았습니다.
파일 -> 편집기 -> 첫 번째 제안: "스마트"가 "항상"으로 변경됨
WebStorm의 js 프롬프트는 전략을 설정하는 데 상대적으로 느립니다
파일 -> > 다음 1000의 자동 팝업 WebStorm에서 0
설정 -> git이 필요하지 않은 경우 github 계정을 변경하세요.
파일 ->플러그인을 선택한 다음 강력한 플러그인을 선택하세요. ("css-X-fire" 플러그인, CSS 속성을 수정하기 위해 Firebug를 사용할 때 사용되며 편집기의 CSS 코드도 변경됩니다.)

Webstorm 사용 경험

WebStorm의 즐겨찾기 기능:
프로젝트 디렉토리가 매우 클 때 일부 자막 디렉토리는 자주 열리지만 레벨이 매우 깊습니다. 이때 디렉토리를 즐겨찾기에 추가하면 왼쪽에 "즐겨찾기" 메뉴가 나타납니다.
#🎜 🎜#
WebStorm의 탐색경로 탐색:
디렉토리를 선택할 수 있는 왼쪽의 프로젝트 페이지 외에도 상단 메뉴 아래에 웹사이트 탐색경로 탐색과 유사한 디렉토리가 있습니다. 또한 동일한 기능을 달성할 수 있습니다. 각 디렉터리를 클릭하면 그 아래의 하위 디렉터리가 표시되는 드롭다운 메뉴가 표시됩니다. 이는 매우 실용적입니다.
WebStorm 생성자 인터페이스:
댓글이 일치하는 경우 형식이 나타납니다. js 파일이면 js 클래스의 함수 및 객체이고, css 파일이면 css 파일의 요약이고, html 파일이면 노드의 구조 다이어그램입니다. 이는 코드 구조를 쉽게 볼 수 있도록 하기 위한 것입니다.
WebStorm의 할 일 인터페이스:
코드에 할 일 주석을 추가하면 이 인터페이스가 나타납니다.# 🎜 🎜#
코드 탭에서 파일을 마우스 오른쪽 버튼으로 클릭한 다음 오른쪽-> 또는 가로로 쏟아짐(상단 및 하단 화면)
코드를 검색하는 좋은 방법

# 🎜🎜##🎜 🎜#WebStorm은 git 사용법을 통합합니다

현재 코드와 저장소 코드 간의 차이점 보기:

코드 인터페이스의 아무 영역이나 마우스 오른쪽 버튼으로 클릭하고 git -> with를 선택한 다음 라이브러리를 비교할 버전을 선택합니다.

webstorm 단축키 설명

#🎜🎜 #Ctrl + Space：

기본 코드 완성(클래스, 메소드 또는 변수 이름) 기본 코드 완성(클래스, 함수 또는 변수 이름), Alt+S

Ctrl + Shift + Enter：
문 완료 현재 문을 완성하세요
Ctrl + P：
매개변수 정보 ( 메소드 호출 인수 내) 매개변수 정보에는 메소드 호출 매개변수가 포함됩니다
Ctrl + 코드 위에 마우스 올리기
간단한 정보 단순 정보
#🎜 🎜#
캐럿에 오류 또는 경고 설명 표시 캐럿에 오류 또는 경고 설명 표시
코드 생성... (Getters, Setters, Constructors) 새 파일 만들기 또는 코드 생성...생성자 함수는 클래스의 모든 필드에 대해 getter 및 setter 메서드를 생성할 수 있습니다
Override 메서드 메서드 재정의#🎜🎜 #

Ctrl + I
# 🎜🎜#
Ctrl + Alt + T
Surround with… (if, else, try, catch, for 등) 선택한 코드 줄을 둘러싸려면 *를 사용합니다. (*에는 if, while, try catch 등이 포함됩니다.)
# 🎜🎜#Ctrl + /
Comment/uncomment with line comment 라인 주석/주석 해제
# 🎜🎜#Ctrl + Shift + /
Comment/comment with block comment 블록 주석으로 주석 처리/주석 해제
Ctrl + W
연속적으로 증가하는 코드 블록 선택 코드 블록 선택, 일반적으로 증분 선택
#🎜🎜 #
현재 선택을 이전 상태로 감소 이전 단축키 롤백, 선택 감소 코드

#🎜🎜 #Alt + Q
Alt + Enter
Ctrl + Alt + L
코드 형식 재지정 템플릿 형식에 따라 코드 형식 지정
Tab/ Shift + Tab
선택한 줄 들여쓰기/들여쓰기 취소선택한 줄 들여쓰기/들여쓰기 취소
Ctrl + 🎜🎜#
Ctrl + C 또는 Ctrl + Insert#🎜🎜 #현재 줄 또는 선택한 블록을 칩보드에 복사 현재 줄 또는 선택한 블록을 칩보드에 복사
Ctrl + V 또는 Shift + 삽입
클립보드에서 붙여넣기 콘텐츠 붙여넣기 클립보드에
Ctrl + Shift + V
최근 버퍼에서 붙여넣기 버퍼에 최신 콘텐츠 붙여넣기
Ctrl + D
현재 줄 또는 선택한 블록 복제 현재 줄 또는 선택한 코드 블록 복사#🎜🎜 #
Delete 캐럿에서 라인 캐럿에서 라인 삭제
Ctrl + Enter
스마트 줄 분할(HTML 및 JavaScript만 해당) 스마트 줄 분리(HTML 및 JavaScript)
#🎜🎜 #
Shift + Enter
새 줄 시작 새 줄 시작
Ctrl + Shift + U
캐럿에서 단어 대/소문자 전환 또는 선택된 블록 커서 위치에서 대소문자 변환
Ctrl + Shift + ] /[
코드 블록 끝/시작까지 선택 코드 블록 끝/시작까지 선택# 🎜🎜#
단어 끝까지 삭제 텍스트 끝 삭제
Ctrl + NumPad+/-
확장/축소 코드 블록 확장/축소 코드 블록
Ctrl + Shift+ NumPad+
모두 확장 모두 확장
Ctrl + Shift+ NumPad-
모두 축소
Ctrl + F4
활성 편집기 탭 닫기