Atom

发表于   |   分类于   |  

Atom 是由GitHub开发的自由及开放源代码的文字与代码编辑器，支持 OS X、Windows 和 Linux 操作系统，支持 Node.js 所写的插件，并内置 Git 版本控制系统。

插件

语言语法

  • language-babel 支持 JavaScript ES201x, React JSX & Flow 语法高亮
  • react 支持 React 语法，缩进，代码片段，自动完成，格式化
  • linter 代码语法检查的基本插件，安装后可以去安装具体语言的语法检查插件，为你的代码提供实时的语法检查和风格检查，支持的语言列表见 AtomLinter

代码编写

  • autocomplete-paths 自动补全路径输入
  • atom-ternjs 非常专业的 JavaScript 静态分析器，基于对代码的静态分析，可以在编码的时候给出对象的属性、函数的参数的提示。还可以基于静态分析查找标识符的定义、搜索标识符的引用、重命名标识符。
  • autocomplete-modules 自动完成 Javascript require/import 语句
  • emmet Web 开发必不可少的插件
  • docblockr 编写注释
  • atom-bootstrap3 Bootstrap 3 代码片段和自动完成
  • javascript-snippets Javascript 和 NodeJS 的代码片段

代码美化

  • atom-beautify 代码格式化插件，支持： HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, SQL
  • pretty-json JSON 格式化工具

写作辅助

辅助工具

版本管理

项目管理

  • todo-show 查找项目中所有包含 TODO, FIXME, CHANGED, XXX, IDEA, HACK, NOTE, REVIEW 的注释
  • project-manager 项目管理插件

其他

参考

其他

附录

教程

插件

Linter

Linter-eslint

Linter-esint 使用 eslint 实现 Javascript 语法检查，它会检查项目本地是否安装了 eslint（NPM 安装），如果没有安装的话，会使用它自身携带的 eslint（要求 eslint 版本高于 v1.0.0）。此外使用 Linter-eslint 需要安装插件 linter，如果没有安装的话，会自动安装。如果已经安装了一个可选的 linter 插件，可以禁用自动安装的 linter。
ESLint 默认没有使用任何规则来检查代码语法，这需要自己手动配置项目的语法检查规则。可以在项目根路径下运行 eslint --init 来快速生成配置文件，然后再根据自己需要手动调整。关于 eslint 的用法可参考博客 Get Started With ESLint 和 ESLint document。

设置

自动完成优化

自动完成提示匹配不准确

autocomplete-plus 的提示排序存在问题，没有完全按照字符排序，参考如下 ISSUES：

解决方案：禁用 autocomplete-plus 的 Alternate Scoring。

其他问题

符号视图缩进

常见问题

React 开发环境

language-babel vs atom-react
| 特性 | language-babel | atom-react |
| — | — | — |
| Syntax Highlighting | + | + |
| Auto Indentation | + | + |
| Code Folding | - | + |
| Snippets | - | + |
| Format | - | + |
| HTML to JSX | - | + |
| Autocomplete | + | + |
| Automatic closing tag | + | + |
| commenting | + | - |