1. Atom 简介
Atom 是支持 Windows、Mac、Linux 三大桌面平台,完全免费,并且在 GitHub 上开源的代码编辑器。立即前往
1.1 优缺点
主要优点
- 开发维护团队强大,开源项目,修复 Bug 速度快,生态圈成长速度快。
- 快捷键支持特别好,熟悉了各种快捷键后可以成倍提高生成效率。
- 比较稳定,很少出现崩溃。
- 插件管理很到位,能准确定位出问题的插件。
- 插件的生态圈发展速度特别快,很多好用的插件。
主要缺点
- 性能问题,启动速度很慢。
- 打开大文件是会出现 CPU 占用过高的问题。
- 目前相比于 Sublime 技术层面还不够成熟,有不少 Bug。
2. 基本使用和配置
2.1 更换源
初次使用Atom的插件系统,APM 需要做一些初始化工作,比如,安装一些相关的依赖包。由于国内网络问题,会导致安装失败或很慢,需要更换为国内的镜像源:
- 将
C:\Users\Yourname\.atom\.apm\.apmrc
拷贝到C:\Users\Yourname\.atom\
目录下 - 编辑
C:\Users\Yourname\.atom\.apmrc
,新增如下内容:
|
|
2.2 技术原理
Atom 是基于Electron,而Electron 是 Chromium 与 Node.js 的集成,它可以访问本地用户界面,包括本地对话框、菜单和窗口控件。
使用 Chromium 浏览网页时,每一个标签页和插件都对应着一个操作系统中的进程。在 Electron 中也沿用了这样的架构,Electron 程序的入口点是一个 JavaScript 文件,这个文件将会被运行在一个只有 Node.js 环境的主线程中。
目前,已经有大量基于 Electron 的应用:
- VS Code 是微软的一款文本编辑器。
- Slack 是一款即时通讯软件。
- Postman 是一个 HTTP API 调试工具。
- Hyper 是一个终端仿真器。
- Nylas N1 是一个邮件客户端。
- GitKraken 是一个 Git 的 GUI 客户端。
- Medis 是一个 Redis 的 GUI 客户端。
- Mongotron 是一个 MongoDB 的 GUI 客户端。
Atom 核心仅仅提供API,功能全部由插件来实现,Atom 默认就捆绑了 77 个插件。
2.3 插件安装方法
- GUI 安装
打开Atom » Packages » Settings View » Install Packages/Themes然后在 “Search packages” 中输入你想要的插件,例如:simplified-chinese-menu,点击 “Install”。
- 下载安装
到 github.com 上搜索插件名,下载相应源代码压缩包。解压后,移动到 C:\Users\Yourname\.atom\packages
- 命令行安装
|
|
3. 插件
3.1 通用插件
- sync-settings:配置备份插件,方便以后的迁移,配合gist实用快捷。
- simplified-chinese-menu:Atom的汉化插件。
- atom-beautify:代码格式化。
- autocomplete-modules:模块名自动补全。
- autocomplete-paths:文件路径自动提示。
- hyperclick:跳转到变量函数声明或者定义的地方。
- markdown-format,markdown-writer:Atom 上写 Markdown。
- markdown-preview-plus:Markdown预览。
- project-manager:Atom 上管理项目。
- vim-mode:Atom 添加 Vim 模式。
- atom-terminal-panel:Atom 内置命令行工具。
- platformio-ide-terminal:终端工具。
- file-icons:不同类型的文件显示不同的文件图标。
- script:执行脚本。
- docblockr:方便写注释,可以根据情况生成不同的注释格式。
- activate-power-mode:打字特效。
- minimap:显示当前文档的缩略图。
- open-unsupported-files:使用系统软件打开 Doc、Excel、PPT等 Atom 不预览的文件。
- minimap-highlight-selected:选中时,高亮相同的文本。
3.2 Git/SVN 插件
- tortoise-svn:Svn插件。
- git-plus:在 Atom 里面执行 git 命令。
- git-control:Git面板。
- git-log:图形化 Git 提交记录。
- atomatigit:可视化 Git 操作。
- tree-view-git-status:文件夹 Git 状态。
3.3 HTML 插件
- atom-html-preview:Atom编辑器内实时预览 HTML 的工具。
- autoclose-html:自动闭合 HTML 标签。
- emmet:html补全,加快 Web 开发速度,提供 Snippet 。
3.4 CSS 插件
- color-picker:取色器。
- autoprefixer:浏览器兼容。
- linter-scss-lint:SCSS 编码规范检查。
- linter-less:LESS 编码规范检查。
- linter-csslint:CSS 编码规范检查。
3.5 JavaScript 插件
- jquery-snippets:Jquery 自动补全 Snippets。
- linter-jshint:jshint 代码检查。
- javascript-snippets:JavaScript 自动补全 Snippets。
- atom-ternjs: JavaScript 代码智能提示补全。
3.6 Python 插件
- atom-python-run:终端运行 Python 代码。
- autocomplete-python:Python 代码自动补全。
- linter-pep8:PEP8 编码规范检查。
- linter-flake8:Flake8 编码规范检查。
- python-tools:提供了强大变量名函数和标准库的补全。
- python-debugger:Python 调试工具。
- atom-django:Atom 对 Django 框架的支持。
- django-templates: Atom 对 Django templates 模板支持。
- language-mako:Atom 对Mako 模板支持。
4. 快捷键
英文 | 中文 | 快捷键 | 功能 |
---|---|---|---|
New Window | 新建界面窗口 | Ctrl + Shift + N | 如中文意思 |
New File | 新建文件 | Ctrl + N | 如中文意思 |
Open File | 打开文件 | Ctrl + O | 如中文意思 |
Open Folder | 打开文件夹 | Ctrl + Shift + O | 如中文意思 |
Add Project Folder | 加载项目目录 | Ctrl + Alt + O | 如中文意思 |
Reopen Last Item | 重新加载上次项目 | Ctrl + Shift + T | 如中文意思 |
Save | 保存文件 | Ctrl + S | 如中文意思 |
Save As | 另存为 | Ctrl + Shift +S | 如中文意思 |
Close Tab | 关闭当前编辑文档 | Ctrl + W | 如中文意思 |
Close Window | 关闭编辑器 | Ctrl + Shift + W | 如中文意思 |
Undo | 撤销 | Ctrl + Z | 如中文意思 |
Redo | 重做 | Ctrl + Y | 如中文意思 |
Cut | 剪切 | Shift + Delete | 如中文意思 |
Copy | 复制 | Ctrl + Insert | 如中文意思 |
Copy Path | 复制文档路径 | Ctrl + Shift + C | 如中文意思 |
Paste | 粘贴 | Shift + Insert | 如中文意思 |
Select All | 全选 | Ctrl + A | 如中文意思 |
Select Encoding | 选择编码 | Ctrl + Shift +U | 就是设置文件的编码 |
Go to Line | 跳转到某行 | Ctrl + G | 支持行列搜索,Row:Column |
Slect Grammar | 语法选择 | Ctrl + Shift + L | 和Sublime的Syntax设置功能一样 |
Reload | 重载 | Ctrl+ Alt +R | 重新载入当前编辑的文档 |
Toggle Full Screen | 全屏 | F11 | 如中文意思 |
Increase Font Size | 增大字体 | Ctrl + Shift + “+” | Sublime的Ctrl +也能生效 |
Decrease Font Size | 减小字体 | Ctrl + Shift + “-“ | Sublime的Ctrl -也能生效 |
Toggle Tree View | 展示隐藏目录树 | Ctrl +|(竖杠) | Ctrl+b可以隐藏不能展示 |
Toggle Commadn palette | 全局搜索面板 | Ctrl + Shift + P | 和Sublime的大同小异 |
Select Line | 选定一行 | Ctrl + L | 如中文意思 |
Select First Character of Line | 选定光标至行首 | Shift + Home | 如中文意思 |
End of Line | 选定光标至行尾 | Shift + End | 如中文意思 |
Select to Top | 选定光标处至文档首行 | Ctrl + Shift + Home | 就是光标处作为分割线,取文档上部分 |
Select to Bottom | 选定光标处至文档尾行 | Ctrl + Shfit + End | 就是光标处作为分割线,取文档下部分 |
Find in Buffer | 从缓存器搜索 | Ctrl + F | 与Sublime一致 |
Replace in Buffer | 高级替换 | Ctrl + Shift + F | 与Sublime一致 |
Select Next | 匹配选定下一个 | Ctrl + D | 和Sublime一模一样有木有 |
Select All | 匹配选定所有 | Alt + F3 | 和Sublime一模一样有木有 |
File | 查询文件,选定打开 | Ctrl + P | 与Sublime不一样 |
Delte End of Word | 删除光标处至词尾 | Ctrl + Del | 如中文意思 |
Duplicate Line | 复制行 | Ctrl + Shift + D | 复制光标所在行自动换行 |
Delete Line | 删除一行 | Ctrl + Shift + K | 如中文意思 |
Toggle Comment | 启用注释 | Ctrl + / | 与Sublime一致 |
Toggle developer tools | 打开Chrome调试器 | Ctrl + Alt + I | 挺神奇的 |
Indent | 增加缩进 | Ctrl + [ | 向右缩进 |
Outdent | 减少缩进 | Ctrl + ] | 向左缩进 |
Move Line Up | 行向上移动 | Ctrl + up | 如字面意思 |
Move Line Down | 行向下移动 | Ctrl + Down | 如字面意思 |
Join Lines | 行链接 | Ctrl + J | 追加 |
newline-below | 光标之下增加一行 | Ctrl + Enter | 与sublime一致 |
editor:newline-above | 光标之上增加一行 | Ctrl + Shift + Enter | 与sublime一致 |
pane:show-next-item | 切换编辑的标签页 | Ctrl + Tab | 如中文意思 |
Fuzzy Finder | 文件跳转面板 | Ctrl + T | 如字面意思 |
Select Line Move above | 选中行上移 | Ctrl + up | 如中文意思 |
Select Line Move below | 选中行下移 | Ctrl + down | 如中文意思 |
Symbol-view | 进入变量、函数跳转面板 | Ctrl + R | 如中文意思 |
5. 最佳实践
5.1 同步插件和配置
这里主要使用了 sync-setting 插件和 Github 提供的 Gist 代码片段服务。
- 1.创建 Gist 项目,成功后,在项目的 URL 中,获取 Gist id。立即前往
- 2.申请 Access Tokens。立即前往
- 3.配置 sync-settings。在 Atom 的配置文件 config.cson 新增如下内容:
C:\Users\Yourname\.atom\config.cson
|
|