<IDE> vscode 프런트 엔드 일반적인 플러그인 추천, JQuery와, 뷰 및 다른 개발 환경을 구축

공식 웹 사이트가 같은, vscode는 (재정의) 코드 편집기를 재정의 말했듯이 vscode은, 코드 편집기의 마이크로 소프트에 의해 개발되고있다. 현재 공동 시장 경량 코드는 주로 에디터 : 숭고한, 메모장 ++, 에디트 플러스, 원자 이러한 유형. 숭고한, vscode 색상 값, 더 편리한 설치 구성 플러그보다 높은; 비교 원자, vscode 시작 속도 비교 메모장 ++, 에디트 플러스는 vscode은 더 코드 편집기와 같은보다, IDE를 가지고 많은 기능을 통합 더 빨리, 카드하지 않는 큰 다양한 파일을 엽니 다. vscode 자유의 높은 수준을 모두 말했다뿐만 아니라, 가장 중요한이 vscode 또는 무료 팀과 지속하고 코드 편집기의 신속한 업데이트,이다, 높은 성능과 높은 색상 값이 될 수있다. vscode가 선호하는 코드 편집기입니다,라고 할 수있다. 개인 추천 쓰기 프런트 엔드 코드, 코드 편집기는 vscode, IDE를 선택 WebStorm을 선택합니다.

  vscode가 다시 시작 vscode를 다시로드를 클릭하여 설치를 기다리고, 설치를 클릭하면 검색 상자에 이름 플러그 - 더를 입력 한 후, 확장 입력 할 수 있습니다, 그림과 같이 플러그인은 버튼을 클릭해야 설치하는 것은 효과 플러그인합니다.

  당신은 단지 입력해야 플러그인 확장을 필요로하지 않는 경우, 사용하지 않도록 설정하거나 플러그인을 제거하도록 선택할 수 있습니다 해당 플러그인의 오른쪽 하단에있는 톱니 바퀴 버튼을 클릭합니다.

 

  지금, 나는 내가 vscode 플러그인의 프론트 엔드 코드를 작성하는 데 더 많은 도움의 일부를 권장합니다 생각 :

  1.Auto 닫기 태그

  자동 폐쇄 HTML / XML 태그


 

   2.Auto 이름 바꾸기 태그

  자동으로 라벨의 반대편에 변경 사항을 밀어

 

  

  3.Beautify

  코드를 포맷, 그것은 다음과 같은 사용자 정의 형식 코드가 규칙에 대한 지원 플러그인을 아름답게 것을 주목할 필요가있다 :

1
4
5
6
(7)
{
   "indent_size" : 4,
   "indent_char" : " " ,
   "css" : {
     "indent_size" : 2
   }
}

  기본 형식 코드가 키를 아름답게 맥 버전 vscode는 cmd를 + B를하고, 사용자 정의 단축키 될 수 있습니다

 

 

  4.Bracket Pair Colorizer

  给括号加上不同的颜色,便于区分不同的区块,使用者可以定义不同括号类型和不同颜色

 

 

  5.Debugger for Chrome

  映射vscode上的断点到chrome上,方便调试

 

 

  6.ESLint

  js语法纠错,可以自定义配置,不过配置较为复杂,建议使用网上一些广泛使用的eslint配置,日后我也会专门针对eslint配置写一篇文章。

 

 

  7.GitLens

  方便查看git日志,git重度使用者必备

 

 

  8.HTML CSS Support

  智能提示CSS类名以及id 

 

 

  9.HTML Snippets

  智能提示HTML标签,以及标签含义

 

 

  10.JavaScript(ES6) code snippets

  ES6语法智能提示,以及快速输入,不仅仅支持.js,还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间

 

 

  11.jQuery Code Snippets

  jQuery代码智能提示

 

 

  12.Markdown Preview Enhanced

  实时预览markdown,markdown使用者必备

 

 

  13.markdownlint

  markdown语法纠错

 

 

  14.Material Icon Theme

  个人认为最好的vscode图标主题,支持更换不同色系的图标,值得点出的是,该插件更新极其频繁,基本和vscode更新频率保持一致

 

 

  15.open in browser

  vscode不像IDE一样能够直接在浏览器中打开html,而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件,支持自定义打开指定的浏览器,包括:Firefox,Chrome,Opera,IE以及Safari

 

 

  16.Path Intellisense

  自动提示文件路径,支持各种快速引入文件

 

 

  17.React/Redux/react-router Snippets

  React/Redux/react-router语法智能提示

 

 

  18.Vetur

  Vue多功能集成插件,包括:语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。vscode官方钦定Vue插件,Vue开发者必备。

 

 

  总结:vscode自从发布以来就横扫各大社区(毕竟微软爸爸),成为了许多开发者的首选代码编辑器。我根据个人vscode使用经验推荐了以上18个插件,希望能对大家有所帮助。同时,也欢迎大家进行交流!

 

  2018.3.19更新:应 @雨雾星天 同学的要求,添加angular相关的vscode插件推荐。

  1.Angular Files

  集成了angular-cli的功能

  

 

  2.Angular 5 Snippets

  angular智能语法提示

 

  

  欢迎大家进行交流~

추천

출처www.cnblogs.com/isAndyWu/p/11588835.html