文件图标: file-icons
根据不同文件后缀名显示不同类型图标
标签栏根据不同文件格式显示色彩: filetype-color
在标签栏不同格式文件显示不同的颜色的标题，支持二度设置。
小地图：minimap
用过 Sublime Text 的友友们都知道有一个很实用的功能，就是内部编辑那里有一个小小的代码图,
这货就是补全 Atom 这个功能的,支持高亮代码,还可控，具体看内部设置。
实时预览HTML页面: atom-html-preview
Atom编辑器内实时预览的工具。
- 快捷键
- 默认快捷键： CTRL + P 调用，会和内置核心插件冲突(切换文件那个)
- 修改版快捷键： CTRL + F12 (感觉方便使用且没有冲突的快捷键)
- 修改自定义键盘映射文件：
#实时浏览器调用快捷键
'atom-text-editor':
'ctrl-F12':'atom-html-preview:toggle'
atom 内置了 Dev Live Reload 这个插件；
这个插件的作用就是重新加载所有样式和规则，
有点类似 linux 的 source xx.sh 一样..即时生效。
调用快捷键是 CTRL + SHIFT + ALT +R
当然，关闭 atom 再开 atom 编辑器也能达到重新加载所有样式规则的效果......
同步备份atom设置到github: Sync-settings
同步 Atom 的设置文件，自定义快捷键，用户风格，初始化脚本及代码片段，还支持已安装的插件同步。
-
初始化设置
- 进入设置中心找到该插件，点击该插件的 setting 项进入到二步设置；
- 打开自己的 github 创建一个personal access token
- 复制生成的 token 序列，粘贴到插件的 sync-settings 插件的二步设置相关的 Token 项中。
- 打开 github 的 gist 服务，创建一个 gist。
- 将 gistID 粘贴到 sync-settings 插件的二步设置相关的 gistID 项中。
- 注:gistID就是在你的gist页面网址最后的那串32位的16进制数字。
- 类似39d20859457f059a84b66577c80d4d38
-
使用方法(配置完毕后)
* 在文档编辑页面，按下全局命令搜索面板(Ctrl+shift+p)
* 搜索sync- ，会有可选项
* sync-settings:backup – 备份当前配置;
* sync-settings:restore – 恢复配置，(将gits上的配置文件)直接覆盖(本地);
* sync-settings:view-backup – 执行备份后到线上查询备份,访问gist;
* sync-settings:check-backup – 查询最后一次备份是否正常;
* 备份成功和失败都有一条信息提醒。
自动补全 autocomplete-plus
完善自带 autocomplete,有二度设置，接下来列出的一些有二度设置
- autocomplete-python — 你懂得，更加细致
- autocomplete-paths — 实用派，路径补全
- autocomplete-html — 你懂得，更加细致
- autocomplete-bibtex — Github的markdown语法
- autocomplete-snippets — 如名字
- autocomplete-css — 你懂得，更加细致
- less-autocompile — 实时编译
- docblockr — 注释插件，非常的实用
支持html和css格式文件中代码速写插件: emmet
html中用法
a、新建空文件后,改变文本格式为html(点击atom最右下角显示的文本格式来改变),
然后在文本空白处输入标签名html、head、div、article、a…后按tab键.
b、多倍数个的同类标签: li*3
c、快速设置class/id属性默认的div标签: .clsName/idName然后tab会出来class/id为clsName/idName的div标签
d、快速设置class/id属性的任意标签: 如h1.title/h1#title出来id/class为title的h1标签
e、>嵌套符来速写嵌套关系的标签: ul>li*3>a
f、{}设置标签内value值:如ul>li{value1}+li{value2}
css中用法
新建空文件后,改变文本格式为css(点击atom最右下角显示的文本格式来改变),
只需书写属性和值的第一个缩写字母+值。
//典型速写举例
//1、输入db后按tab键
display: block;
//2、输入dib后按tab键
display: inline-block;
//3、输入mb10
margin-bottom: 10px;
//4、输入m10%
margin: 10%;
更多缩写用法请查看emmet官网
webserver服务器插件: atom-live-server
用法介绍:
ctrl-shift-3 launch live server on port 3000.
ctrl-shift-4 launch live server on port 4000.
ctrl-shift-5 launch live server on port 5000.
ctrl-shift-8 launch live server on port 8000.
ctrl-shift-9 launch live server on port 9000.
更多请参考atom-live-server官网
关于atom的绝赞插件有好的会随时再更新。
end