플러그인 설치 추천

지금까지 개발된 코드 편집기에 대해 모두 가장 좋은 선택이 없었다. vscode는 내가 발견한 속도가 상대적으로 빠르다. 새 버전의 html css js 요소와 속성을 필터하고 가장 정확한 코드 편집기를 제시한다. 플러그인이 너무 많아서 어떤 사람들은 어떤 플러그인을 선택해야 가장 좋은지 모른다. 본 문서에서 어떤 플러그인을 설치해야 하는지 알려주고 선택할 수 있는 것은 다음과 같다.
01. open in browser: 브라우저에서 미리 보기(alt+b)를 실행하고 설치 후 자동으로 √√02, OneDark: Atom에서 온 테마로 색깔이 더욱 부드럽고 편안하며 눈을 상하지 않는 테마입니다. ctrl+k에 ctrl+t를 추가하여 설치한 후 테마 √?03, autorename tag: HTML 라벨을 수정할 때 일치하는 라벨을 자동으로 수정하고 설치 후 자동으로 ?04;04;04, 04Autify: JSON|JS|HTML|CSS|SCSSS를 포맷할 수 있습니다. 내장 포맷보다 사용하기 좋습니다. 설치 후 자동으로 √√05, pathautocomplete: 경로 스마트 보완(시스템에 자체 경로가 있는데 이것은 필요 없습니다). path intellisense보다 강하고 연속 알림이 가능하며'/'를 누르지 않습니다. 설치 후 자동으로 √?06;06;06,ize: 밑에 있는 상태 표시줄에 현재 파일 크기를 표시하고 클릭한 후에 상세한 창설, 수정 시간을 볼 수 있습니다. 설치 후 자동으로 √√07, html css support: html 라벨에class 스마트 알림을 써서 현재 프로젝트가 지원하는 스타일(vue 지원, 내장 버퍼링 지원)(도입 경로를 방해하기 쉽고), 설치 후 자동으로 ??08;08; 08, 08; 08,html snippets(0.1.5 버전): 초실용적이고 초보적인 H5 코드 세그먼트 및 힌트, 설치 후 자동 실행 √√09; 09, IntelliSense for css class names: css class 입력 힌트, 설치 후 자동 실행 √√√ 10, css peek: 현재 페이지에서 자동으로 CSS 문서를 찾아 내용을 표시하고, 설치 후 자동 실행 ??11;11;, Document this: Js의 주석 템플릿,두 번 반복해서 ctrl+alt+d를 누르면 함수의 주석√√12,eslint: js 필수, 설치 후 자동 운행, 테스트 설치 후 자동 운행√√13;, Can I Use: HTML5, CSS3, SVG의 브라우저 호환성 검사 설치 후 자동 운행√?14;, GBKTOUTF-8: 파일 GBK를 utf-8 인코딩으로 변환하여 설치 후 자동 운행?√√15,code spell check: 코드 단어 검사 설치 후 자동으로 실행√√
15. Debugger for Chrome: 디버깅 용이, 안○○○16,vetur: 문법 하이라이트, 스마트 감지, Emmet 등, 안○○17, Vue 2 Snippets:vue 필수, 안○○○18, VueHelper: Vue2 코드 세그먼트(Vue2 api, vue-router2, vuex2 포함), 안○19, git history: Git log, file, 라인 역사 기록 조회 가능, Debugger for안○○○20, 코드runner: 코드 컴파일링 실행 결과, 많은 백엔드 언어 지원, 안○○○○
21. path intellisense: 자동 경로 알림, 기본적으로 이 기능이 없는 path intellisense는 더욱 스마트하기 때문에 22, 가이드: 코드 정렬 보조선을 설치할 필요가 없습니다. 새 vscode는 이 기능을 내장하고 설치할 필요가 없습니다.23. auto close tag: HTML 태그를 자동으로 닫습니다. 새 vscode에는 이 기능이 내장되어 있어서 설치할 필요가 없습니다.24, file peek: 마우스를 경로 이름으로 이동하고 ctrl을 누르면 파일을 열 수 있습니다. 시스템이 내장되어 있어서 설치할 필요가 없습니다.25,background: vscode의 배경을 수정하고 여분을 사용하지 않으며 시스템 기본값을 사용하면 됩니다.26. vscode-icons: vscode 자원 트리 디렉터리에 아이콘을 추가하고 첫 번째 옵션 파일 아이콘 테마에서 선택하며 사용하지 않고 시스템 기본값을 사용하면 27, eclipse 키맵: eclipse 단축키를 사용하여 설치 후 자동으로 실행하고 vscode의 단축키를 수정하면 됩니다.
28, Trailing Spaces 검사 여분의 공백 29, Turbo Console.log () 는 아주 긴 문장을 입력하는 것을 좋아하지 않는다. 예를 들어 console.log().특히 빨리 출력하고 값을 보고 인코딩을 계속할 때만 짜증난다.만약 내가 너에게 말한다면, 너는 Lucky Luke처럼 어떤 것도 신속하게 컨트롤러에 기록할 수 있니?
이는 터보 콘솔 로그라는 확장을 통해 수행됩니다.이것은 다음 줄의 모든 변수를 로그 기록하고 코드 구조 다음에 자동으로 접두사를 추가할 수 있습니다.이 확장에 추가된 모든 주석/주석 alt+shift+u / alt+shift+c 을 취소할 수도 있습니다.
단축키: 1, 포맷 코드: ctrl+alt+f 2, 권장 트리거:alt+/
vscode 사용자 구성은 다음과 같습니다.
"//파일 경로""files.autoSave"":""off"",//git.path의 실행 가능한 파일 경로""git.path"":""C:/Program Files/Git/bin/git/git.exe"",""editor.renderControlCharacters"":true,//OneDark++""workbench.colorTheme"":""Solarized Light"",//공백""editor.render.renderWhitespace"",//파일 이름 보정 시 자동 가져오기""path-autocomplete.extensionOnImport":true,//autocompletion 이외의 경로 문자열을 사용합니다.//입력할 때 "editor.quickSuggestions"를 자동으로 표시할지 여부를 제어합니다: {"other":true, "comments":true, "strings":true},/를 사용하면 파일을 저장할 때 공백을 따라 잘라냅니다."files.trimTrailingWhitespace":true,//가 활성화되면 사용된 매개 변수와 방법 이름의 유형을 알려 줍니다."docthis.inferTypesFromNames":true,//editor.cursorStyle이 "line"으로 설정된 경우 커서의 너비를 제어합니다."editor.cursorWidth": 0,//항상 ESLint 상태 표시줄 "eslint.always Show Status"를 표시합니다:true,//자동 복구 저장 또는 닫기 "eslint.autoFix On Save":true,//파일을 저장할 때마다(ctrl+s)eslint 플러그인은 자동으로 현재 파일에 대한 eslint 문법을 수정합니다!"eslint.validate": ["javascript", "javascriptreact", "html", {"language": "vue", "오토픽스:true}", "eslint.options": {"plugins": [html"]},//eslint의 두 공백 간격에 부합하기 위해"editor.tabSize": 4,//편집기는 입력한 후 자동으로 줄의 형식인"editor.formatype"를 설정해야 하는지 여부를 제어합니다.//HTML 태그의 자동 닫기를 사용/사용 안 함으로 설정합니다.html.autoClosingTags:true,//가 활성화되면 TAB 키를 누르면 Emmet 약자가 확장됩니다.emmet.triggerExpansionOnTab: true,//글꼴 크기를 픽셀 단위로 제어합니다."editor.fontSize": 13, }