Atom 编辑器入门快捷键插件安利

作者: 木猫尾巴 | 来源:发表于2015-12-02 17:50 被阅读25310次

[TOC]

在使用前

ATOM 是Github主导的Web版的编辑器

已经稳定了，这个调试功能已经隐藏，撒花~
~~目前还是测试阶段，功能很多，bug也很多，如果出现错误，请使用~~
~~强制误差调整大法快捷键 OSX ctrl-alt-cmd-l Win alt-ctrl-r~~

说明： ATOM 的快捷键和 Sublime Text 差不多，大部分可以混用

提示，使用快捷键 * Win ctrl-shift-p * OS X cmd-shift-p 可以搜索快捷键，也可以在关闭所有文档的时候，滚动提示快捷键

本文整理的是OS X的快捷键

文件切换

ctrl-shift-s 保存所有打开的文件

cmd-shift-o 打开目录

cmd-\ 显示或隐藏目录树

ctrl-0 焦点移到目录树注意这里是数字 0 非常实用，也可以用 cmd+\来变相达到效果

目录树下，使用a，m，delete来增加，修改和删除

cmd-t 或 cmd-p 查找文件

cmd-b 在打开的文件之间切换

cmd-shift-b 只搜索从上次 git commit 后修改或者新增的文件

目录树操作

cmd-\\ 或者 cmd-k cmd-b 显示(隐藏)目录树

cmd+| 不同键盘可能快键键不一样，美标键盘是 cmd+shift+\\ ，功能是快速定位当前文件在目录树的位置,功能名称 Reveal in tree view

ctrl-0 焦点切换到目录树(再按一次或者Esc退出目录树)

a 添加文件
d 将当前文件另存为(duplicate)
i 显示(隐藏)版本控制忽略的文件

alt-right 和 alt-left 展开(隐藏)所有目录

ctrl-al-] 和 ctrl-al-[ 同上

ctrl-[ 和 ctrl-] 展开(隐藏)当前目录

ctrl-f 和 ctrl-b 同上

cmd-k h 或者 cmd-k left 在左半视图中打开文件

cmd-k j 或者 cmd-k down 在下半视图中打开文件

cmd-k k 或者 cmd-k up 在上半视图中打开文件

cmd-k l 或者 cmd-k right 在右半视图中打开文件

ctrl-shift-C 复制当前文件绝对路径

书签

cmd-F2 在本行增加书签

F2 跳到当前文件的下一条书签

shift-F2 跳到当前文件的上一条书签

ctrl-F2 列出当前工程所有书签

选取

大部分和导航一致，只不过加上shift

ctrl-shift-P 选取至上一行

ctrl-shift-N 选取至下一样

ctrl-shift-B 选取至前一个字符

ctrl-shift-F 选取至后一个字符

alt-shift-B, alt-shift-left 选取至字符开始

alt-shift-F, alt-shift-right 选取至字符结束

ctrl-shift-E, cmd-shift-right 选取至本行结束

ctrl-shift-A, cmd-shift-left 选取至本行开始

cmd-shift-up 选取至文件开始

cmd-shift-down 选取至文件结尾

cmd-A 全选

cmd-L 选取一行，继续按回选取下一行

ctrl-shift-W 选取当前单词

编辑和删除文本

基本操作

ctrl-T 使光标前后字符交换

cmd-J 将下一行与当前行合并

ctrl-cmd-up, ctrl-cmd-down 使当前行向上或者向下移动

cmd-shift-D 复制当前行到下一行

大小写转换

cmd-K, cmd-U 使当前字符大写

cmd-K, cmd-L 使当前字符小写

删除和剪切

ctrl-shift-K 删除当前行

cmd-backspace 删除到当前行开始

cmd-fn-backspace 删除到当前行结束

ctrl-K 剪切到当前行结束

alt-backspace 或 alt-H 删除到当前单词开始

alt-delete 或 alt-D 删除到当前单词结束

多光标和多处选取

cmd-click 增加新光标

cmd-shift-L 将多行选取改为多行光标

ctrl-shift-up, ctrl-shift-down 增加上（下）一行光标

cmd-D 选取文档中和当前单词相同的下一处

ctrl-cmd-G 选取文档中所有和当前光标单词相同的位置

括号跳转

ctrl-m 相应括号之间，html tag之间等跳转

ctrl-cmd-m 括号(tag)之间文本选取

alt-cmd-. 关闭当前XML/HTML tag

编码方式

ctrl-shift-U 调出切换编码选项

查找和替换

cmd-F 在buffer中查找

cmd-shift-f 在整个工程中查找

代码片段

alt-shift-S 查看当前可用代码片段

在~/.atom目录下snippets.cson文件中存放了你定制的snippets

自定义快捷键说明

自动补全

ctrl-space 提示补全信息

这个快捷键经常和系统快捷键冲突修改 keymap.json 快捷打开在 Settings > Keybindings > your keymap file 里

添加如下代码

'atom-text-editor':
  'alt-/': 'auto-complete-plus:activate'

就将 alt-/ 设置为提示补全信息的快捷键，当然也可以用其他不冲突的快捷

折叠

alt-cmd-[ 折叠

alt-cmd-] 展开

alt-cmd-shift-{ 折叠全部

alt-cmd-shift-} 展开全部

cmd-k cmd-N 指定折叠层级 N为层级数

文件语法高亮

ctrl-shift-L 选择文本类型

使用Atom进行写作

ctrl-shift-M Markdown预览

可用代码片段

b, legal, img, l, i, code, t, table

git操作

cmd-alt-z checkout HEAD 版本

cmd-shift-B 弹出untracked 和 modified文件列表

alt-g down alt-g up 在修改处跳转

alt-G D 弹出diff列表

alt-G O 在github上打开文件

alt-G G 在github上打开项目地址

alt-G B 在github上打开文件blame

alt-G H 在github上打开文件history

alt-G I 在github上打开issues

alt-G R 在github打开分支比较

alt-G C 拷贝当前文件在gihub上的网址

插件管理

插件安装需要检查native环境

apm install --check

osx 按下快捷键 cmd+, (Win 为 ctrl+, 不过经常和输入冲突，在File->Settings中) 打开Settings菜单
选择左侧的Packages页卡，搜索插件
点选插件标题进入 Atom.io 页面，点选插件内容进入插件管理
右下有卸载插件和关闭插件的开关

插件native环境检查错误解决方法

出现类似这个错误

gyp info it worked if it ends with ok
gyp info using node-gyp@3.4.0
gyp info using node@4.4.5 | win32 | ia32
gyp http GET https://atom.io/download/atom-shell/v1.3.13/iojs-v1.3.13.tar.gz
gyp http 200 https://atom.io/download/atom-shell/v1.3.13/iojs-v1.3.13.tar.gz
gyp http GET https://atom.io/download/atom-shell/v1.3.13/SHASUMS256.txt
gyp http GET https://atom.io/download/atom-shell/v1.3.13/win-x64/iojs.lib
gyp http GET https://atom.io/download/atom-shell/v1.3.13/win-x86/iojs.lib
gyp http 200 https://atom.io/download/atom-shell/v1.3.13/SHASUMS256.txt
gyp http 200 https://atom.io/download/atom-shell/v1.3.13/win-x86/iojs.lib
gyp http 200 https://atom.io/download/atom-shell/v1.3.13/win-x64/iojs.lib
gyp WARN install got an error, rolling back install

是无法完成atom.io的302重定向，gyp无法完成http GET
全局翻墙即可

临时的解决方案，就是把ATOM_NODE_URL环境变量设为重定向之后的Url

# Windows temporary
set ATOM_NODE_URL=http://gh-contractor-zcbenz.s3.amazonaws.com/atom-shell/dist
# Windows permanently (execute “cmd” with “Run as Administrator”)
setx ATOM_NODE_URL http://gh-contractor-zcbenz.s3.amazonaws.com/atom-shell/dist /M
# OSX or Linux
export ATOM_NODE_URL=http://gh-contractor-zcbenz.s3.amazonaws.com/atom-shell/dist

推荐一些好用的插件

安装插件之前

如果访问 Atom.io/package 慢，应该是DNS污染导致，设置hosts 到 atom.io 就能减轻重试次数

也可以参考 Atom 指南中文翻译 http://mazhuang.org/atom-flight-manual/

Atom 设置代理

apm config set strict-ssl false
apm config set https-proxy https://proxy-host:8080

直接去改.apmrc 每次启动总会被重置,改.apmrc的方法废弃

~/.atom/.apmrc

http-proxy=http://...
https-proxy=http://...
strict-ssl=false

必装插件

sync-settings 配置同步工具

需要 github 帐户给予 gist 授权，步骤为

1 打开页面 https://github.com/settings/tokens/new
1.1 填写 `Token description`，勾选 `gist` 确定
1.2 找个安全的地方将 token 记录下来，因为后面这个 token 不再显示，更新 token
2 打开页面 https://gist.github.com/ 创建一个
2.1 `Gist description...` 留空
2.2 `File name including extension..` 填入 `packages.json`
2.3 内容任意写，这里我填入的是当前时间的 md5 值
2.4 点击 `Create secret gist`， 当然如果你想别人共享你的设置，可以选择 `Create public gist`
2.5 跳转的页面路径为 https://gist.github.com/${你的用户名}/${gistID} ，把后面的gistID 复制记录下来
3 将记录下来的 token 填写到 settings-sync 配置的 `Personal Access Token`，将 gistID 填写在 `Gist Id`

sync-settings 可以按 token 不同设备使用相同的 gistID 来同步配置，同理，不同设备的请自行区分设置
查看自己的gist 列表 https://gist.github.com/${你的用户名}/

# 上传配置
sync-settings:Backup
# 拉取配置
sync-settings:Fork

set-syntax 支持语言渲染切换，快捷键 cmd + shift + p 输入 set [语言]
last-cursor-position 快速跳转到最近的修改，快捷键 atl + - 调整到最近的修改位置
linter 识别多门语言的错误,但是不细致，主插件，可以针对性的安装更细致的检查插件
支持查找Git AtomLinter
bottom-dock 上下文提示插件，很多插件依赖这个，快捷键

ctrl-k ctrl-t : toggles panel 组合快捷键，按二次
ctrl-k ctrl-r : refreshes window 组合快捷键，按二次
ctrl-k ctrl-c : closes window 组合快捷键，按二次

linter-manager linter的管理器需要安装 linter 和 bottom-dock，快捷键和 bottom-dock 一致
linter-xmllint 没有人不用XML吧，这是XML语法提示
linter-jsonlint 怎么能少了json检查呢
autocomplete-plus （貌似默认安装好了）完善原有 autocomplete,有二度设置，现已加入豪华套餐
trailing-spaces 多余空格自动高亮插件，此插件默认不开启，设置里自行开启高亮提示
autocomplete-paths 自动补全文件路径插件

编辑文本与跳转

hyperclick 代码跳转，用cmd-mousedown，或者 cmd-alt-enter 进入代码
vim-mode 用过 vim 的都知道好,基本实现了大部分的功能，不过造成许多快捷键冲突，慢慢排除
jumpy AceJump 风格的跳转快捷键 shift-enter 详细查看说明，此插件能可能导致顿卡。
quick-jump AceJump 风格的跳转快捷键 ctrl-; 目前版本有冲突，不可用

主题

dracula-ui JetBrain 家的德古拉皮肤主题，适合小屏幕
dracula-theme JetBrain 家的德古拉代码渲染主题，适合小屏幕
atom-material-ui 非常好看的UI
monokai sublime 的代码渲染主题，配合 atom-material-ui 视觉效果拔群
atom-material-syntax UI的附属字体渲染

美化

atom-beautify 一键代码美化。

代码格式化插件，支持的语言查看帮助文档，此插件需要配置快捷键，推荐使用快捷键 cmd-alt-l

'atom-text-editor':
    'alt-cmd-l': 'atom-beautify:beautify-editor'

minimap 内部编辑那里有一个小小的代码图,这货就是补全 Atom 这个功能的,支持高亮代码,还可控，具体看内部设置
minimap-find-and-replace 功能同 minimap，简化一些
file-icons 给文件加上好看的图标。
filetype-color 在标签栏不同格式文件显示不同的颜色的标题，支持二度设置
tool-bar 工具栏增强在 ATOM 1.8 时有兼容问题

命令行-一款就够，推荐 tokamak-terminal

tokamak-terminal Win OSX 通用的命令行工具 fork 至 terminal-plus
快捷键 `ctrl-``

Atom 1.12 以后不能直接使用这款插件，修复方法是，最新版本不需要怎么做，如果遇到可以用类似的方法修复

# 也可以直接点击Setting进入 Packages/Tokamak Terminal 点击 View Code
cd ~/.atom/packages/tokamak-terminal

修改package.json至

"dependencies": {
    "atom-space-pen-views": "^2.1.0",
    "pty.js": "https://github.com/platformio/pty.js/tarball/prebuilt",
    "term.js": "https://github.com/jeremyramin/term.js/tarball/master",
    "underscore": "^1.8.3"
  },

{
        "name": "pty.js",
        "version": "^0.3.1",
        "path": "node_modules/pty.js/index.js"
      },

然后在 ~/.atom/packages/tokamak-terminal 中删除 node_modules 再执行 apm i

terminal-plus Win OSX 通用的命令行工具，目前最好用的一款 (停止更新无法支持 ATOM 1.7)以上
快捷键 `ctrl-``
terminal-panel 直接在atom里面写命令 Mac 专用
atom-terminal-panel Windows 使用这个可以很好的执行命令行，出现乱码自行修改编码
快捷键 shift-enter 打开面板 Ctrl-` 关闭面板

注意相同功能插件会冲突，可以disable一个，快捷键冲突的时候，自行定义一下

git

atomatigit 可视化git操作
git-plus 与Sublime Text 的 sublimegit 功能基本一致
merge-conflicts git conflicts 合并工具 (default hotkey: alt-m d)

'atom-text-editor.conflicted':
  'alt-m down': 'merge-conflicts:next-unresolved'
  'alt-m up': 'merge-conflicts:previous-unresolved'
  'alt-m enter': 'merge-conflicts:accept-current'
  'alt-m r': 'merge-conflicts:revert-current'
  'alt-m 1': 'merge-conflicts:accept-ours'
  'alt-m 2': 'merge-conflicts:accept-theirs'

'atom-workspace':
  'alt-m d': 'merge-conflicts:detect'

代码提示

color-picker 取色器
pigments 颜色显示插件
regex-railroad-diagram 正则表达式图形化插件
emmet web开发工具箱。神器有个别快捷键会和 Markdown preview 快捷键冲突，改下就好
atom-ternjs js代码提示很强大，高度定制化。
docblockr jsdoc 给js添加注释。
autoclose-html 闭合html标签。
preview 预览各种代码效果
svg-preview svg预览

react 插件

react react 语法支持
atom-react-native-autocomplete react-native 自动代码补全
atom-react-preview react 预览

前端插件

autoprefixer 用来补充 css 前缀的，会自动生成多个浏览器的前缀

前端可能 `autocomplete`

autocomplete-paths 实用路径补全
autocomplete-html html更加细致（已加入豪华套餐）
autocomplete-bibtex Github 的 markdown 语法
autocomplete-snippets 如名字（已加入豪华套餐）
autocomplete-css 更加细致（已加入豪华套餐）

前端可能 `linter`

linter-jshint , for JavaScript and JSON, using jshint
linter-jscs , for JavaScript, using JSCS
linter-js-standard , for JavaScript, Standard Style
linter-coffeelint , for CoffeeScript, using coffeelint
linter-coffeescript ,on the fly, using coffee
linter-tslint , for Typescript, using tslint
linter-tidy , for HTML, using tidy
linter-php , for PHP using php -l
linter-pylint , for Python, using pylint
linter-scss-lint , for SASS/SCSS, using scss-lint
linter-less , for LESS, using less
linter-csslint , for CSS, using csslint
linter-stylint , for Stylus, using stylint
linter-stylus , for Stylus, using stylus

实用技巧

Atom 显示空格换行回车等隐藏元素

在 Setting 的 Core Setting 中寻找分类 Scoll Sensitivity 勾上选项 Show Invisbles 就可以显示tab space 回车换行了
推荐使用能配合monokai代码渲染的主题如： atom-material-ui atom-dark one-dark
如果是其他主题，觉得空格显示的效果不明显找到栏目 Invisible Space 输入内容 — 或者 - 加强现实效果重新载入生效或者重新载入生效

参考

futantan/atom 文章源自：https://github.com/futantan/atom 作者：futantan
Atom使用教程文章源自：http://wiki.jikexueyuan.com/project/atom/plug-in.html 作者：wiki.jikexueyuan.com

网友评论

39ba216a057d:《Atom 编辑器入门快捷键插件安利- 简书》写的挺不错的，已经收藏了。

源码解析：http://tinyurl.com/ycqn86hj

献
8afe04d66ee7:写的不错，谢谢博主；已收藏~
洛小贼:格式化代码是啥?
木猫尾巴: @洛小贼 atom-beautify 一键代码美化插件
普罗米修斯GO:很好的
潇洒的风666:最近学习前端，html编辑，使用atom,很好的快捷键教程。谢谢。
classtag:什么时候才能回归到原生的编辑器啊。快捷键学习的成本好高。换一个编辑器换一次，好累
4a235bf9e6f1:@全栈攻城狮不会啊，我感觉sublime和Atom几乎一样，不过还是sublime轻些，速度快
木猫尾巴:@智能机器人为原生编辑器是啥？vi？
atom快捷键提供了搜索的，atom非常适合快速调试，得到好工具的代价是学习它。
17c843532326:不错的教程

Atom 编辑器 入门 快捷键 插件安利