首页 > 编程知识 正文

vscodepython常用插件,vscode前端开发必备插件

时间:2023-05-04 17:23:56 阅读:161343 作者:4248

1. vscode简介vscode是微软开发的代码编辑器,如官方网站所示,vscode重新定义了代码编辑器。 目前市场上常用的轻型代码编辑器主要有: sublime、notepad、editplus、atom。 与notepad、editplus相比,vscode集成了许多只有IDE的功能,更像代码编辑器。与sublime相比,vscode 颜值更高可以说vscode具有启动速度更快,,但最重要的是,vscode还是一个免费的、团队不断快速更新的代码编辑器。 vscode可以说是代码编辑器的首选。 如果您自己编写前端代码,高自由度、又拥有高性能和高颜值vscode安装插件只需单击图片中所示的按钮即可进入扩展。 在搜索框中输入插件名称并单击“安装”,然后单击http://www.Sina.com/restart vs code启用该插件,只需等待安装。

如果不需要有wrdjmg的插件,只需进入扩展,点击对应插件右下角的齿轮按钮即可选择代码编辑器选择vscode,IDE选择WebStorm。该插件。

2 .前端常用插件(ps:必备推荐了解)重新加载

禁用或卸载

自动关闭HTML/XML标记

必备的一定要装, 推荐的看自己需要, 了解的可不装 !!!

自动完成对侧标签的同步修改

1.Auto Close Tag (必备)

 2.Auto Rename Tag(必备)

vue中的配置方法和快捷键的配置击中了这里

 3.Beautify (必备)

JavaScript/TypeScript/CSS格式

教程击中这里

格式化 html ,js,css

括号有不同的颜色,便于区分方框,使用者可以定义括号的类型和颜色

另一款 Prettier

将vscode断点映射到chrome,以便于调试

调试方法戳这个

  4.Bracket Pair Colorizer (必备)

js语法纠错可以自定义配置,但由于配置复杂,建议使用在internet上广泛使用的eslint配置。 今后也会专门为eslint构成写文章。

5.Debugger for Chrome (推荐)

需要git重要用户才能更容易地查看git日志

使用教学课程

6.ESLint (推荐)

智能提示CSS类名和id

 7.GitLens(使用git的必备)

智能提示HTML标签和标签的含义

8.HTML CSS Support (必备)

ES6语法的智能提示和快速输入不仅支持. js,还支持. ts、 jsx、 tsx、 html和. vue,从而省去设置以支持包含各种js的代码文件的麻烦

9.HTML Snippets (必备)

jQuery代码智能提示

10.JavaScript(ES6) code snippets (必备)

ong>

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

 

 

  13.markdownlint (推荐)

  markdown语法纠错

 

 

  14.Material Icon Theme (推荐)

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

       极简主义是不需要的

 

 

      另一套 目录树图标主题 vscode-icons 

使用方法,配置如下json

 

  15.open in browser (必备)

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

设置默认浏览器 

 

  16.Path Intellisense (必备)

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

 

 

  17.React/Redux/react-router Snippets (推荐)(react必备)

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

 

补充两个

1) React-Native/React/Redux snippets for es6/es7

react代码片段,下载人数超多

2) react-beautify

格式化 javascript, JSX, typescript, TSX 文件

 

 

  18.Vetur (推荐)(vue必备)

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

 

补充 两个: 

1) VueHelper

vue代码片段

2) Vue TypeScript Snippets

vue的 typescript 代码片段

3) Vue 2 Snippets

vue 2代码片段

 

       19.Dracula Official (推荐)

  很好看的一款主题风格

    这样的

       

       20.filesize (了解)

  查看文件大小

 

 

 

       20.HTMLHint(了解)

   静态检查规则 具体规则戳这

 

     21. Class autocomplete for HTML (推荐)

     智能提示HTML class =“”属性(必备)

 

     22. IntelliSense for CSS class names (推荐)

     智能提示 css 的 class 名

     

     23.  Npm Intellisense(node必备)

     require 时的包提示

 

如果还有好的插件我会随时补充 ~~~

这里有一份更详细的清单,欢迎参考

vscode 官方插件库​​​​​​​

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。