VS Code 和 Sublime Text 3 安装及常用插件安装
大家可以加我的个人微信,一起在学习交流群,交流学习,我的微信号:woainivery
VS Code
1. Auto Close Tag 自动添加HTML / XML关闭标签
2. Auto Rename Tag 自动重命名配对的HTML / XML标签
3. Beautify 格式化代码
4. Bracket Pair Colorizer 颜色识别匹配括号
5. Code Runner
非常强大的一款插件,能够运行多种语言的代码片段或代码文件:C,C ++,Java,JavaScript,PHP,Python,Perl,Ruby,Go等等
安装完成后,右上角会出现:▶
6. change-case
虽然 VSCode 内置了开箱即用的文本转换选项,但其只能进行文本大小写的转换。而此插件则添加了用于修改文本的更多命名格式,包括驼峰命名、下划线分隔命名,snake_case 命名以及 CONST_CAS 命名等
7. Chinese (Simplified) Language Pack for Visual Studio Code 中文简体语言包
8. Color Info
这个便捷的插件,将为你提供你在 CSS 中使用颜色的相关信息。你只需在颜色上悬停光标,就可以预览色块中色彩模型的(HEX、 RGB、HSL 和 CMYK)相关信息了
9. CSS Peek
使用此插件,你可以追踪至样式表中 CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时,选择“ Go to Definition 和 Peek definition ”选项,它便会给你发送样式设置的 CSS 代码
10. Debugger for Chrome
前端调试,
11. ESLint
EsLint可以帮助我们检查Javascript编程时的语法错误。比如:在Javascript应用中,你很难找到你漏泄的变量或者方法。EsLint能够帮助我们分析JS代码,找到bug并确保一定程度的JS语法书写的正确性
12. filesize
在底部状态栏显示当前文件大小,点击后还可以看到详细创建、修改时间
13. Git History 以图表的形式查看 git 日志
14. GitLens — Git supercharged
显示文件最近的 commit 和作者,显示当前行 commit 信息
15. HTML Boilerplate
通过使用 HTML 模版插件,你就摆脱了为 HTML 新文件重新编写头部和正文标签的苦恼。你只需在空文件中输入 html,并按 Tab 键,即可生成干净的文档结构
16. HTMLHint HTML 代码格式检测
17. HTML Snippets 代码自动填充
18. htmltagwrap
在选中HTML标签中外面套一层标签 ”Alt + W” (“Option + W” for Mac)
19. Image Preview 鼠标移到路径里显示图像预览
20. Indenticator 突出目前的缩进深度
21. intelliSense for CSS class names in HTML
把项目中 css 文件里的名称智能提示在 html 中
22. JavaScript (ES6) code snippets es6代码片段
23. Live Server 浏览器实时刷新
24. Node.js Modules Intellisense 可以在导入语句中自动完成JavaScript / TypeScript模块
25. npm Intellisense require 时的包提示
26. Path Intellisense 路径自动补全
27. Quokka.js
Quokka 是一个调试工具插件,能够根据你正在编写的代码提供实时反馈
使用方法: ctrl+shift+p 输入 quokka 选择 new javascript 就可以了
28. Regex Previewer
这是一个用于实时测试正则表达式的实用工具。它可以将正则表达式模式应用在任何打开的文件上,并高亮所有的匹配项
29. SVG Viewer
此插件在 Visual Studio 代码中添加了许多实用的 SVG 程序,你无需离开编辑器,便可以打开 SVG 文件并查看它们。同时,它还包含了用于转换为 PNG 格式和生成数据 URI 模式的选项
30. Vetur
Vue 语法高亮显示, 语法错误检查, 代码自动补全 (配合 ESLint 插件效果更佳)
31. vscode-fileheader
顶部注释模板,可定义作者、时间等信息,并会自动更新最后修改时间
快捷键: Ctrl+Alt+i
(默认信息可在 文件→首选项→设置 中修改)
32. jQuery Code Snippets,
jQuery代码智能提示
33. Material Icon Theme
个人认为最好的vscode图标主题,支持更换不同色系的图标,值得点出的是,该插件更新极其频繁,基本和vscode更新频率保持一致
34. open in browser
scode不像IDE一样能够直接在浏览器中打开html,而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件,支持自定义打开指定的浏览器,包括:Firefox,Chrome,Opera,IE以及Safari
35. Vetur
Vue多功能集成插件,包括:语法高亮,智能提示,emmet,错误提示,格式化,自动补全,debugger。vscode官方钦定Vue插件,Vue开发者必备。
总结:vscode自从发布以来就横扫各大社区(毕竟微软爸爸),成为了许多开发者的首选代码编辑器。我根据个人vscode使用经验推荐了以上插件,希望能对大家有所帮助。同时,也欢迎大家进行交流!
Sublime Text 3
一、sublime3的下载
1. 百度搜索 sublime text 3 download
2. 选择下载 Windows 64 bit 安装
二、sublime text 3的安装
傻瓜式的安装,一直下一步
三、sublime text 3的插件配置
1.直接安装
安装Sublime text 3插件很方便,可以直接下载安装包解压缩到Packages目录(菜单->preferences-> Browse Packages)。
2.使用Package Control组件安装
如果没有package control组件,可以安装package control组件;
快速安装 使用Ctrl+`快捷键或者通过View->Show Console菜单打开命令行,粘贴如下代码(注意下面代码为一行):
import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
复制代码
按下enter键,稍等即可,
安装完毕后,重启sublime,此时就可以在Preferences菜单下看到Package Settings和Package Control两个菜单了。
汉化sbulime Text3
(1)启动并进入sublime主界面;
(2)点击菜单栏中“preferences”,弹出选项中找到“package control”;
(3)点击 package control;就会出现一个页面进入下一步,选择“install package”;
(4)继续下一步,尝试输入“localization”,因为我已经安装,所以下拉就不会再显示这个插件名,
(5)安装完之后,可以在菜单中查看到是否有此插件;
(6)点开 帮助 栏,找到language,就可以选择你想要的语言了
用Package Control安装插件的方法:
按下Ctrl+Shift+P调出命令面板
输入install 调出 Install Package 选项并回车,然后在列表中选中要安装的插件。
注意:安装插件时保持网络畅通,避免插件由于网络原因奔溃
三、一些有用的Sublime Text 3插件:
1. Emmet(原名 Zen Coding)
一种快速编写html/css的方法
注意:安装Emmet的同时,也会自动安装其依赖PyV8 binary库,安装PyV8库会用较长时间,可以在Sublime左下角看到安装进程状态
2. html5
支持hmtl5规范的插件包
注意:与Emmet插件配合使用,效果更好
使用方法:新建html文档>输入html5>敲击Tab键>自动补全html5规范文档
3. jQuery
支持JQuery规范的插件包
4. JSFormat
JS代码格式化插件。
使用方法:使用快捷键ctrl+alt+f
5. SublimeLinter
一个支持lint语法的插件,可以高亮linter认为有错误的代码行,也支持高亮一些特别的注释,比如“TODO”,这样就可以被快速定位。(IntelliJ IDEA的TODO功能很赞,这个插件虽然比不上,但是也够用了吧)
6. BracketHighlighter
类似于代码匹配,可以匹配括号,引号等符号内的范围。
使用方法:系统默认为白色高亮,可以使用链接所述方法进行自定义配置
7. Alignment
代码对齐,如写几个变量,选中这几行,Ctrl+Alt+A,哇,齐了。
8. Ctags
函数跳转,我的电脑上是Alt+点击 函数名称,会跳转到相应的函数
9. DocBlockr
注释插件,生成幽美的注释。标准的注释,包括函数名、参数、返回值等,并以多行显示,省去手动编写。
VS Code 和 Sublime Text 3 安装及常用插件安装相关推荐
- Sublime Text 3便携版下载安装和常用插件安装--顺便解决报错An error occured installing和no packages available for install
文章目录 Sublime Text 3便携版下载安装和常用插件安装 1.Sublime Text 3便携版下载: 2.sublime 插件控制器(Package Control)安装 2.1离线安装P ...
- Sublime Text 无法使用Package Control或插件安装失败的解决方法
Sublime Text用了一年多了,公司搬家最近突然发现Package Control无法安装新插件了,虽然不影响原有功能的使用,还是要解决它.由于本人用Windows系统,只讨论Windosw下的 ...
- Sublime Text 无法使用Package Control或插件安装失败的解决方法【转】
Sublime Text用了一年多了,公司搬家最近突然发现Package Control无法安装新插件了,虽然不影响原有功能的使用,还是要解决它.由于本人用Windows系统,只讨论Windosw下的 ...
- sublime text 3 前端开发常用插件
sublime text 3 前端开发常用插件 https://packagecontrol.io/browse 代码对齐: Alignment html代码补全: Emmet CoffeeScri ...
- Sublime Text 3安装及常用插件安装
一.Sublime3下载 1.百度搜索Sublime3 download,选择进入下载页面 2.我选择下载Win64位安装程序 ##二.Sublime3安装 傻瓜式安装,一直点下一步即可. ##三.S ...
- redmine3.3.1安装与常用插件安装
redmine安装 环境:CentOS6.7 软件: mysql5.X redmine3.3.1 ruby2.3.1 rubygem2.6.8 nginx1.9.15 安装依赖包: yum -y in ...
- sublime text 3 代码比对插件安装使用
引言 最近调试程序需要对两个差别不大的源代码做比对,用到了这个插件,在此处分享. 安装步骤 电脑要联网,不需要挂VPN 1. 打开sublime text3 ,快捷键 Ctrl + shift + p ...
- sublime python插件_sublime text 3 + python配置,完整搭建及常用插件安装
四年的时间,一直使用EmEditor编辑器进行Python开发,之前是做面向过程,只需要将一个单独的py文件维护好即可,用着也挺顺手,但是最近在做面向对象的开发,不同的py文件中相互关联较多,感觉单纯 ...
- sublime python插件配置_sublime text 3 + python配置,完整搭建及常用插件安装
四年的时间,一直使用EmEditor编辑器进行Python开发,之前是做面向过程,只需要将一个单独的py文件维护好即可,用着也挺顺手,但是最近在做面向对象的开发,不同的py文件中相互关联较多,感觉单纯 ...
最新文章
- linux压缩图片脚本,说明Ubuntu压缩图片脚本批量方法
- 08_传智播客iOS视频教程_Foundation框架
- 05--MySQL自学教程:DDL(Data Definition Language:数据库定义语言)操作数据库中的表(二)
- boost::range::istream_range相关的测试程序
- 数字三角形的显示 java
- 带你了解VXLAN网络中报文的转发机制
- jquery ajax提交表单数据的两种方式
- iphonex屏幕失灵乱跳_6plus触屏失灵时好时坏,屏幕乱闪乱跳
- 学习构造函数、拷贝构造函数、析构函数和重载运算符
- python去除列表指定位置元素_Python实现判断并移除列表指定位置元素的方法
- 机器学习系列-tensorflow-03-线性回归Linear Regression
- Latex 语法总结(持续更新)
- 长春高中计算机考试时间安排,2017年长春中考考试时间安排
- Redis11_缓存穿透和雪崩
- 迷宫寻径问题(数据结构4.4.3)
- 学好SEO需要掌握哪些知识要点?
- 我们如何研发了世界上最酷的调车内燃机车自动驾驶系统
- 写给零基础的前端算法入门指南,acmer带女友刷80+【递归与回溯篇】|牛气冲天新年征文
- 半边数据结构【Half Edge】
- 地平线正式落户上海临港 政企合作推动城市智能化发展
热门文章
- linux7.3系统u盘制作,制作centos7U盘启动盘
- jdbc驱动jar_Javagt; 连接数据库时,JDBC和Mybatis的区别
- 外部表不是预期的格式_超详细的CMDB介绍--概念、架构、模型、表设计及开源选择...
- thinkphp mysql批量入库_ThinkPHP3.2框架使用addAll()批量插入数据的方法
- 概念区分:并行、分布式、集群、云、超算
- [caffe解读] caffe从数学公式到代码实现4-认识caffe自带的7大loss
- 全球及中国汽车后视镜行业供需分析与需求前景预测报告2022-2027年
- 中国聚氨酯胶粘剂行业现状研究分析及市场前景预测报告(2022年)
- C#中值类型和引用类型
- oracle 取系统当前年份_Oracle如何获取系统当前时间等操作实例