程序员的编辑器 Atom

1. Atom 简介

Atom 是支持 Windows、Mac、Linux 三大桌面平台，完全免费，并且在 GitHub 上开源的代码编辑器。立即前往

1.1 优缺点

主要优点

• 开发维护团队强大，开源项目，修复 Bug 速度快，生态圈成长速度快。
• 快捷键支持特别好，熟悉了各种快捷键后可以成倍提高生成效率。
• 比较稳定，很少出现崩溃。
• 插件管理很到位，能准确定位出问题的插件。
• 插件的生态圈发展速度特别快，很多好用的插件。

主要缺点

• 性能问题，启动速度很慢。
• 打开大文件是会出现 CPU 占用过高的问题。
• 目前相比于 Sublime 技术层面还不够成熟，有不少 Bug。

2. 基本使用和配置

2.1 更换源

初次使用Atom的插件系统，APM 需要做一些初始化工作，比如，安装一些相关的依赖包。由于国内网络问题，会导致安装失败或很慢，需要更换为国内的镜像源：

1

registry=https://registry.npm.taobao.org/

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:UsersYourname.atompackages

• 命令行安装

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

// 安装指定包
apm install <package_name>

// 安装指定版本的包
apm install <package_name>@<package_version>

// 查找包
apm search <package_name>

// 查看包更多详情
apm view <packge_name>

// 查看当前已安装包(包含默认Atom捆绑和个人安装)
apm list

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. 快捷键

5. 最佳实践

5.1 同步插件和配置

这里主要使用了 sync-setting 插件和 Github 提供的 Gist 代码片段服务。

• 1.创建 Gist 项目，成功后，在项目的 URL 中，获取 Gist id。立即前往
• 2.申请 Access Tokens。立即前往
• 3.配置 sync-settings。在 Atom 的配置文件 config.cson 新增如下内容：

C:UsersYourname.atomconfig.cson

1
2
3

"sync-settings":
    gistId: "b3025...88c41c"
    personalAccessToken: "6a10cc207b....7a67e871"

6. 参考

• https://marshal.ohtly.com/2016/07/16/using-atom-as-a-python-editor/
• https://atom.io/docs
• https://github.com/futantan/atom
• https://atom.io/packages/sync-settings
• https://zhuanlan.zhihu.com/p/23536047