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-f2  to add/remove a bookmark on the current line 增加或者移除当前行的书签
• ctrl-shift-f2  to remove all bookmarks in the current editor 去掉当前编辑框的所有书签
• ctrl-f2  to view all the bookmarks 查看所有书签
• f2  to move the cursor to the next bookmark 跳转到当前光标的下一个书签处
• shift-f2  to move the cursor to the previous bookmark. 跳转到当前光标的上一个书签处