vscode (Visual Studio Code)安装汉化以及前端常用插件推荐

个人IDE软件使用经过 DW => HBulider => sublime => vscode,感觉还是 vscode 用着更爽一些。

vscode 全称 Visual Studio Code 是一个由微软开发的,同时支持Windows、Linux和macOS操作系统且开放源代码的文本编辑器,支持很多用得着用不着的功能,自己去发掘吧。

一、下载安装

直接到 官网 点击 Download 进行下载安装,网站会自动判断你的操作系统,提供符合你操作系统的下载链接,也可以自己选很方便。
在这里插入图片描述

安装很简单就不在这里赘述了。

二、汉化以及前端插件安装

点击下面左边红色框的按钮,然后在输入框输入自己想要安装的插件名然后点击安装,安装完成后点击重新加载就可以了。
在这里插入图片描述
在这里插入图片描述

1、Chinese Language

简体中文汉化插件,和我一样英文不好的童鞋可以安装这个插件进行汉化。这个插件重载之后还没有汉化成功的话,把编辑器关闭重新打开就行了。

2、vscode-icons

让 vscode 资源树目录加上图标,有利于我们进行文件格式的判断。

3、HTML Snippets

很实用的 HTML 代码提示插件。

4、HTML CSS Support

HTML 标签上写class 智能提示当前项目所支持的样式。

5、jQuery Code Snippets

jQuery 代码提示,用 jQuery 框架的必须装。

6、Path Intellisense

自动路径补全,方便我们进行图片、CSS、JavaScript等文件的路径编写。

7、Bootstrap 3 Sinnpet

Bootstrap 3 代码提示插件,常用的话需要下载一个。

8、Atuo Rename Tag

修改 html 标签,自动帮你完成尾部闭合标签的同步修改。

9、Bracket Pair Colorizer

给括号设置不同的颜色,有利于括号多的时候进行区分。

10、小程序助手
11、minapp
12、wechat-snippet

这三个都是微信小程序的代码提示及自动补全插件,现在微信小程序这么火怎么可以不下载。

以上这些是个人常用并且感觉非常好用的,还有一些其他的插件,比如

13、HTMLHint

HTML代码检测

14、beautify

格式化代码插件,感觉编辑器自带的就够用了。

15、Document this

js 的注释模板 (注意:新版的vscode已经原生支持,在function上输入/** tab)

16、vscode-fileheader

顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间

17、Indent-Rainbow

使得对齐更加具有可读性

18、IntelliSense for CSS class names in HTML

基于你的项目以及通过link标签引用的外部文件,该智能插件提供 HTML 中 CSS class 名字的补全。

19、Trailing Spaces

高亮那些冗余的空格,可以快速删掉

20、lit-html

在 JavaScript/TypeScript 的文件中,如果有使用到 HTML 标记,lit-html 提供语法高亮和相应的补全支持。

21、CSS Peek

可以在 HTML 中通过 CSS id 或则 class 来定位到其定义。

Vue 开发需要用到的相关插件

22、Terminal

安装后可以直接在 vs code 中进行命令行操作,可以省去单独打开命令行工具的麻烦,非常方便实用。

23、Vue 3 Snippets
24、Vue VSCode Snippets

这两个是 Vue 开发的利器,提供代码片段,语法高亮等等功能,可以为开发省去很多敲重复代码的时间。

  • 24
    点赞
  • 68
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值