Atom编辑器的插件
先说下atom的插件安装方法吧,因为没用过苹果电脑,所以这里就只说下windows的操作吧。
” ctrl+, “调出设置面板

点击install按钮,进去搜索插件面板
1.expose

在搜索框搜索expose,默认搜索的是packages,即插件,这里会有点慢,要等待一会儿,搜索完成后,点击install按钮,我这里是已经安装好的了,安装也要一会儿时间
安装完成后,既可以使用该插件了,快捷键是 shift+alt+e ,点击快捷键后,出现下图

出现该界面后,可以直接键盘,1-9,数字进行切换,也可以←(方向键向左)和→(方向键向右)进行切换,最后enter(回车)即可进入页面。
2.color-picker
可以直接跳出颜色面板,快捷键
ctrl+alt+c

3.file-icons
安装此插件后,左侧的菜单树中不同的文件会标示上不同的小图标,下面两图分别是安装之前和安装之后


4.atom-beautify
格式化代码插件,使用方法:
ctrl+shift+p
,调出搜索框输入beautify,出现如下

enter第一行后代码就自动格式化
5.autoprefixer
自动补全代码前缀,写完需要补全的代码,安装后的使用方法:
1)在css或者scss文件中,直接ctrl+shift+p,调出搜索框,输入插件名

如上图,使用插件后,代码自动补全
2)在html文件中,需要选中style中的css代码,在进行上面1)的操作
6.advanced-open-file
新建文件或者打开某文件的插件,这是个很有用的插件呦,快捷键:ctrl+alt+o,

若要新建文件,则选择对应的目录,输入名称后回车即可,若要打开某文件,则切换至改文件下,回车即可以进入该文件
7.open-in-browers
可以是html文件直接在浏览器中打开的插件,使用方法:在文件上右键出现操作面板

选择想要的浏览器即可
第二种方法,当安装完这个插件后,如果当前打开的是html文件,这文件的左下角的工具啦会出现下面图中的五种小图标,分别对应不同的浏览器,点击相应的即可

8.autocomplete-paths
自动补全路径,当遇到需要输入路径的时候,这个插件可以出现提示,如下

9.Build Sass
自动编译sass文件成css文件,使用方法如下

10.emmet (
!好用)
这个插件应该都知道,sublime中同样好用的插件,自动补全代码,非常好用的插件,如下

输入后点击tab键变成

11.cssComb
整理css的插件,使用方法:ctrl+shift+p调出搜索框,输入csscomb确定即可

12.minimap
安装这个插件后,会出现类似于sublime text的右侧小地图的东西

悬浮还会出现操作按钮

点击操作按钮后还出现一些选项,可以自己都试试

13.Bookmarks
这个插件应该是安装atom的时候自带的,不过挺好用的,中文就是字面意思:书签,快捷键如下
Windows
-
alt-ctrl-f2to add/remove a bookmark on the current line 增加或者移除当前行的书签
-
ctrl-shift-f2to remove all bookmarks in the current editor 去掉当前编辑框的所有书签
-
ctrl-f2to view all the bookmarks 查看所有书签
-
f2to move the cursor to the next bookmark 跳转到当前光标的下一个书签处
-
shift-f2to move the cursor to the previous bookmark. 跳转到当前光标的上一个书签处
Atom编辑器的插件的更多相关文章
- atom编辑器社区插件推荐
atom是github出品的文本编辑器,为开发者又提供了一款易用.牛逼的文本编译器.在开始接触前端并从工作开始一直用webstrom来进行前端开发,开始使用时,被他各种强大神奇的功能给折服:支持zen ...
- atom编辑器安装插件报错。。
Checking for native build tools failed gyp info it worked if it ends with ok gyp info using node-gyp ...
- Atom 编辑器插件:amWiki 轻文库
amWiki 是一款基于 Javascript 脚本语言.依赖 Atom 编辑器.使用 Markdown 标记语法的轻量级开源 wiki 文库系统. amWiki 致力于让大家可以更简单.更便捷的建设 ...
- Atom 编辑器 前端基本插件
Atom 编辑器插件 这个编辑器是github出品,现在处于免费试用期:如果是初学者,可以使用这个编辑器,插件安装很方便,只需要点菜单栏的File-Settings-Install,在搜索框中输入想要 ...
- Atom编辑器中安装Emmet插件失败的问题
今天使用Atom编辑器安装Emmet插件的时候,刚开始的时候报错: 报错内容如下: Installing “emmet@2.4.3” failed.Show output… Compiler tool ...
- atom编辑器插件atom-ternjs
这是官方文档:https://atom.io/packages/atom-ternjs 官方介绍: JavaScript code intelligence for atom with Tern. A ...
- Atom编辑器入门到精通(二) 插件的安装和管理
在本节中我们会学习如果安装和使用插件插件是Atom中一个非常重要的组成部分,很多功能都是以插件形式存在的.比如上篇文章中提到的目录树和设置等窗口都是通过默认安装的插件来实现的. 查看已安装的插件 打开 ...
- APICloud支持Atom编辑器,并建立开发工具核心库
APICloud支持Atom编辑器开发工具 APICloud始终坚持多开发工具支持策略,开发者无论使用Sublime Text3.Eclipse还是Webstorm,都可以在APICloud平台中找到 ...
- Atom编辑器入门到精通(四) Atom使用进阶
在本节中将介绍Atom提供的更高级的使用技巧,通过这些技巧将会进一步提高你的代码编写效率 代码片段(Snippets) Snippets是一种在代码中快捷插入代码块的方式,下面是维基百科中对Snipp ...
随机推荐
- ANDROID中去掉ACTIONBAR或TABWIDGET的分隔线
在android中,有时需要对ActionBar或者TabWidget的分隔线进行定制,如取消,相关的属性设置为android:divider 以TabWidget为例,取消对应的函数: tabWid ...
- hortonworks2.5.3 install step log
1.创建本地YUM源,下载TAR.GZ HDP,HDP-UTILS,AMBARI介质安装HTTPD,在/VAR/WWW/HTML/下创建三个相应的目录,把以上解压的三个目录链接过来在三个目录中执行命令 ...
- 博客代码美化(SyntaxHighlighter)
这篇博文主要讲解自己使用SyntaxHighlighter对代码进行美工中遇见的问题以及如何使用SyntaxHighlighter? 首先来看看SyntaxHighlighter对代码美工的效果吧! ...
- phpqrcode 生成二维码
这个项目需要根据信息来自动生成二维码,到网上搜了下,发现php有生成二维码的类库phpqrcode,所以打算就用这个来生成二维码 从官网下载类库源码http://sourceforge.net/pro ...
- Python+selenium自动化脚本编辑过程中遇到的问题和小技巧
应该也不算是问题和技巧,算是实践中学习到的Python,记录下,也不定时更新 1.通过截取url判断 实例: self.assertEqual(self.broswer.current_url[sel ...
- 第8章 文件系统管理(2)_挂载、fdisk分区及分配swap分区
3. fdisk分区 3.1 fdisk命令分区过程 (1)添加新硬盘 (2)查看新硬盘#fdisk –l (3)使用fdisk命令分区:#fdisk /dev/sdb Fdisk交互指令说明 命令 ...
- [No00007D]2016-面经[上]
面试常见问题: 题一:"请你自我介绍一下" 思路:1.这是面试的必考题目.2.介绍内容要与个人简历相一致.3.表述方式上尽量口语化.4.要切中要害,不谈无关.无用的内容.5.条理要 ...
- MySQL的基本知识 -- 命令
1.数据库和表 SHOW DATABASES; 返回可用数据库的一个列表 SHOW TABLES; 返回一个数据库内的表的列表 SHOW COLUMNS FROM tableName; 返回数据表的表 ...
- PHP开发环境搭建
链接: Q&A1.Mac下的PHP环境搭建 Mac 下如何搭建 PHP 开发环境? [PHP] Mac下homebrew安装及php.mysql.nginx环境安装及配置个人PHP开发环境的选 ...
- PAT 1033. 旧键盘打字(20)
旧键盘上坏了几个键,于是在敲一段文字的时候,对应的字符就不会出现.现在给出应该输入的一段文字.以及坏掉的那些键,打出的结果文字会是怎样? 输入格式: 输入在2行中分别给出坏掉的那些键.以及应该输入的文 ...