Atom的简介下载配置使用-新一代编辑神器(powered by

2016-12-02 本文已影响1927人 q破晓晨曦p

2017-08-08修订
虽然Atom是我经常使用的工作工具，但是最近观察在同事电脑上的表现，确实是有些问题。例如Atom本身占用内存超多，一般使用都在1.5G左右和我的chrome不相上下。同时打开文件速度较慢有时还会出现奔溃及未响应的状况。由于我的电脑之前是固态ASUS内存12G，后来换成MAC16G内存因此ATOM的弊病较难遇到。如果出现上述问题，那么建议使用Sublime或者VSCode或者Adobe的Bracket，这几个不算是WS那种的占用内存的大型IDE同时也有不错的体验。

2017-05-11修订

Atom简介

何为 ATOM

Atom 是(GitHub)专门为程序员推出的一个跨平台文本编辑器。具有简洁和直观的图形用户界面，并有很多有趣的特点：支持 CSS，HTML，JavaScript 等网页编程语言。它支持宏，自动完成分屏功能，集成了文件管理器。

为什么用 ATOM

开源 -- 遵循 MIT 协议,代码托管在 Github 上。
多平台 -- 支持 MAC/WIN/LINUX(支持源码编译安装,也提供二进制安装包)。
丰富的插件库 -- 开源到现在一年了..社区的各种插件丰富起来了,且 Atom 的插件支持在线更新。
类 Sublime -- 风格和 sublime text 极其相似,不管是风格还是操作上,快捷键上一些是通用的,应该借鉴
采用包管理技术 -- 采用了 node.js 来访问文件系统和包管理。
强大的生命力 -- 背靠 Github 社区,这对于 Atom 来说,可以注入源源不断的生命力。

Atom下载

Atom1.12.6版本

下载地址: https://atom.io/

Atom配置

之前使用的sublime Text3 配置的比较好用，但是总感觉距离顶尖的编辑器差了那么一点。自从知道并使用Atom开始才发现这是比较符合我要求的编辑器。

编辑器下载下来必须折腾一番才能成为你心仪的帮手，这里开始进行Atom的自定义风格和下载你日常使用的插件。

操作1：

atom002.jpg

进入设置页面

在这里可以进行Atom的各种设置。比如快捷键，管理下载升级安装你的主题、插件等。

atom003.jpg

安装一个主题

Atom分为两个主题设置。一种是界面UI主题，一种是代码高亮主题，当然下载的插件可能只有一种或者两种都有。monokai是我在subliem便喜欢使用的代码高亮主题。1.搜索栏输入monokai 2.点击Themes进行主题搜索 3.等待一会发现monokai 点击右边的install按钮可以在线安装 4.点击插件名字可以打开 GitHub网页链接 5.点击插件内容（主体）可以打开Atom 内部的插件描述说明

atom004.jpg

更换主题

更换一个主题

atom005.jpg

atom006.jpg

可以点击主题title进入网页查看当前主题说明和查看其它的主题

自己喜欢的主题安装完毕后

开始安装插件

本人平时做web开发，把我自己用的插件发出来给大家参考，大家如果有什么好用的插件也可以@我。由于Atom到现在这个版本已经集成了很多的插件，因此需要安装的也不是很多。如果Atom在线安装不了的话，可以到Github下载下来然后本地进行 npm 安装

http://jingyan.baidu.com/article/375c8e19c3105a25f2a22901.html

Atom安装了自动提示插件（autocomplete）和它的plus，因此我们再安装一个 emmet就可以了。其他的语言提示在autocomplete后面加上-xml 等。
atom-beautify是一个自动格式化代码的插件。快捷键：Ctrl+Alt+B。刚才按了一下居然还能格式化Markdown文件。
atom-html-preview html文件在Atom打开。快捷键：Ctrl+Shift+H，可以在Atom进行网页实时预览，支持右键检查。
css-snippets写css能给予提示。
color-picker调色盘。快捷键：Ctrl+Alt+c
css-color-underlinecss颜色下划线显示。这里推荐使用pigments能对所有文件的颜色进行代码颜色背景色的标注。
minimapAtom右边的代码小地图功能，类似于sublime的小地图，但是注意这个插件在mac能用，在windows会出错然后导致你其他的插件几乎都无法使用。
file-iconsAtom没有文件图标，这个插件能把文件图标相应的显示出来。还有一个插件跟这个差不多
highlight-selected双击选择并高亮文字。
javascript-snippets jquery-snippets对js和jq的方法等进行提示。
monokai主题
script 直接运行js文件，需要配置
Atom本身不支持一些文件格式可以添加对应插件使得Atom可以支持例如language-stylus

注意：Atom将插件放在了 C:\Users\Users\.atom\packages的位置。卸载Atom不会影响配置和插件。插件可以重用，直接放在这个文件夹即可。

Atom使用

有了atom-html-preview的实时预览，平时基本可以不用Hbuilder了。
有了webbox-color和color-picker可以快速的选定颜色。
Atom支持GitHub的Markdown 使用Ctrl+Shift+p 调出命令模式然后输入 mdpt 回车可以预览Markdown文件
Atom打开速度不如sublime快 Atom F11 之后界面比sublime看起来爽
Atom分屏快捷键先按Ctrl+k 然后四个方向键随便按一个
Atom快速隐藏侧边栏 Ctrl+\
Atom删除一行 Ctrl+Shift+k 快速删除一行 Ctrl+x
记不住插件的一些快捷键也没事文件里面右键就能看到插件提供的功能
Atom右下角更改编码格式、文件格式、靠左靠右左下角显示文件地址和光标所在位置
Ctrl+Shift+P 调出一个菜单，记不住快捷键可以使用这个方式进行查找例如Ctrl+Shift+M的markdown预览，可以输如 mdpt(简写) 也可以输入完整英文单词
Atom在我的rmbp上也是主力，作为IDE来使用已经完全超越了sublime(还不是因为国产的一些IDE相当辣鸡 mmp 👎 当然不是指Hbuilder)
VSCode我也使用过，功能也很强，好像现在插件还差点，而且菜单比较大还是中文，我已经用不惯了。。。

彻底删除ATOM(MAC)

rm -rf ~/.atom
rm -rf /usr/local/bin/atom
rm -rf /usr/local/bin/apm
rm -rf /Applications/Atom.app
rm -rf ~/Library/Preferences/com.github.atom.plist
rm -rf "~/Library/Application Support/com.github.atom.ShipIt"
rm -rf "~/Library/Application Support/Atom"
rm -rf "~/Library/Saved Application State/com.github.atom.savedState"
rm -rf ~/Library/Caches/com.github.atom
rm -rf ~/Library/Caches/Atom

6-13 嗯

不知道是不是因为装的插件有问题，左边文件夹栏没有那些操作功能了，重装一遍。另外大家谁知道Atom有提示原生js的插件(直接提示的参考Hbuilder)请务必要告诉我！其实vscode有时会替代Atom使用一下。

image.png

5-11 有史以来最重大修订:
新增一堆插件导致现在Atom速度又满了 ⑨
由于更新数量较多已经无法一一列举上面的文章在5-11之后已经彻底不能看，下面给出Atom插件的链接，诸君请自己去尝试吧。注意：切忌同时安装大量插件，最好装完一个插件熟悉一下用法和名字，避免装了很多插件导致过度浪费还会拖慢Atom速度。