123tc123 的BLOG
用户名：123tc123
访问量：240
注册日期：
阅读量：5863
阅读量：12276
阅读量：381455
阅读量：1073483
51CTO推荐博文
一、atom安装：github安装链接：Debian Linux (Ubuntu)Currently only a 64-bit version is available.Download atom-amd64.deb from the .Run sudo dpkg --install atom-amd64.deb on the downloaded package.Launch Atom using the installed atom command.The Linux version does not currently automatically update so you will need to
repeat these steps to upgrade to future releases.Red Hat Linux (Fedora 21 and under, CentOS, Red Hat)Currently only a 64-bit version is available.Download atom.x86_64.rpm from the .Run sudo yum localinstall atom.x86_64.rpm on the downloaded package.Launch Atom using the installed atom command.The Linux version does not currently automatically update so you will need to
repeat these steps to upgrade to future releases.二、atom插件安装方式：1、通过Atom 自带的 apm 的 Package 管理工具管理插件。#apm help installPS:命令之后应该输出 apm install 的详细信息；否则，打开 Atom 菜单，选择& Install Shell Commands 来安装& apm。#apm install [&package_name&...]PS:安装指定名称的插件#apm install &package_name&@&package_version&PS:安装指定插件的具体某个版本#apm install --packages-file list-packages.txtPS:安装指定的文件中列出的插件批量安装#apm lsPS:列出atom已安装的插件2、通过atom的偏好设置安装插件。三、atom常用插件推荐：1、autocomplete-plus ，当输入的时候，提供可能的候选项。2、atom-ctags ，使用& ctags &来强化自动完成功能，需借助于& autocomplete-plus 。3、javascript-snippets，顾名思义，输入特殊的字符后自动扩展成对应的 Javascript 代码片段。4、vim-modeVIM-Mode 支持在 Atom 中使用&VIM&编辑器的操作方式来编辑。这对我来说是个非常 Killer 的
Package ，在此之前我一直在 WebStorm 上通过一个插件模拟 VIM 操作，异常难用。而在 Atom
上的这个模拟VIM操作，使用起来感觉还是比较顺手的。你可以混合 VIM 操作和普通的编辑操作。5、emmet手写&HTML&多少显得专业，但是手写的问题在于得大量的代码。Emmet大幅提升手写的效率。非常值得一装。6、go-to-line，跳转到指定的行，只要&ctrl + g&后输入行号即可。7、jshint，验证你的 JavaScript ，写更专业的 JavaScript 代码。8、csslint， CSSLint 会报告出不合规定的 CSS 规则。9、git plus，在 Atom 里面执行 Git 命令，不用来回切换终端和编辑器。10、minimap，为 Atom 加上 Sublime Text 的源码预览图，提供丰富的自定义选项，值得一用。11、file-icons，显示文件类型对应的图标。12、atom-beautify，格式化代码，更统一的代码风格。13、Color Picker在编辑器里面挑选颜色。通过右键选择&Color picker&，或者&cmd + shift + c/ctrl + alt + c&快捷键调出颜色选择面板。支持&HEX, HEXA, RGB, RGBA, HSL, HSLA&形式指定的颜色值。14、csscomb，CSSComb&的一个扩展工具， CSSComb 帮你写出更漂亮的 CSS ！15、autoprefixer，AutoPrefix的一个扩展工具，自动为 CSS 属性添加特定的前缀。16、在偏好设定界面，输入python，选择安装需要的python相关d额插件。。。【参考网站：/article-6871-1.html?utm_source=tuicool&utm_medium=referral】本文出自 “” 博客，请务必保留此出处
了这篇文章
类别：┆阅读(0)┆评论(0)jquery教程
html在线教程推荐这篇日记的豆列
······Github开源编辑器Atom常用插件及安装方法
博客已迁移至： , 期待你的光临！
工欲善其事，必先利其器！
这款被称为“21世纪”的代码编辑器——Atom， 是开源免费跨平台的，并且整合 GIT 并提供类似 SublimeText 的包管理功能，
同时，支持插件扩展，可配置性非常高……，乍一看，像极了Sublime Text，但当你在使用时却感觉还是特别爽！！！
先放几张靓图，感受一下！
基于Github的常用插件
目前Atom编辑器最新的版本是: v1.3.1，附上官网：[Atom官网](https://atom.io/)，长这样的：
当然， 你也可以在Github上直接找到下载地址：[Github上的下载地址](/atom/atom/releases/tag/v1.3.1)
安装插件前准备
[1] 先了解下Atom的设置界面：
打开Atom后使用键盘快捷键“Alt”，可以打开和隐藏菜单栏，不妨试试看，选择File -& Settings，便可以打开设置界面（如图）：
设置界面主要有六个部分：
1. Settings: 通用设置；
2. Keybindings: 快捷键设置；
3. Packages: 插件管理；
4. Themes: 设置和安装主题；
5. Updates: 更新插件
6. Install: 安装插件 或主题
在Settings界面，我们先做一下常用的设置：
1. Core Settings -& File Encoding: utf-8;
2. Editor Settings 中：
Audo Indent 选上;
Font Family中 Windows默认使用Consolas字体，很适合编程，可以自定义，写上字体名称即可；
Fonts Size: 设置字体大写；
Line Height: 设置行高，如1.3；
Show Indent Guide：缩进下垂线，选上；
Show Line Number： 行号，选上；
Soft Wrap: 超出行长度限制后，自动折行；
Tab Length: 4；
**其他的都保持默认吧！！！**
[2] 翻墙：加速插件下载速度
就用蓝灯吧，GitHub搜索lantern，Windows自动安装无需任何设置，记得使用Google Chrome不一样的体验，附上lantern地址：[lantern Github下载地址](/getlantern/lantern)，打开浏览器是这样的：{Youtube, facebook,都上去了！速度还可以}
本文推荐使用Atom自带插件管理器进行安装
**在Settings界面的Install选项中，可以搜索插件或者主题进行下载安装，有的可能会提醒重启Atom才能激活**，界面下边还有Hot推荐插件列表：
顾名思义，这款插件在窗口的右边栏打上遮罩，为 Atom 加上 Sublime Text 的源码预览图，提供丰富的自定义选项，值得一用，效果如1。
activity-power-mode
Atom装逼插件，配上个青轴机械键盘，我看见代码在跳舞啊，动次动次动动次！！！
装上之后使用快捷键：Ctrl + Alt + o 激活
autocomplete-plus
当输入的时候，提供可能的候选项。
javascript-snippets
输入特殊的字符后自动扩展成对应的代码片段。
在 Atom 里面执行 Git 命令，不用来回切换终端和编辑器。
merge-conflicts
解决Atom中合并冲突插件！
可以根据文件名称，或所选的代码块，或行号执行代码，支持大多数编程语言！！！
使用 ctags 来强化自动完成功能，需借助于 autocomplete-plus。
插件[9] autocomplete-python
Python包、变量、方法、函数声明等自动匹配
color-picker
颜色拾取器，在编辑器里面挑选颜色。通过右键选择 Color picker ，或者 cmd + shift + c/ctrl + alt + c 快捷键调出颜色选择面板。支持 HEX, HEXA, RGB, RGBA, HSL, HSLA 形式指定的颜色值。
python-tools
Python提高生产力的必备工具！！！
默认快捷键：ctrl+alt+u
xml-formatter
XML代码格式化工具， 默认快捷键：SHIFT-CTRL-X
autocomplete-paths
自动匹配文件路径工具！
atom-html-preview
html文档预览工具， 默认快捷键：CTRL-SHIFT-H
atom-beautify
格式化代码，更统一的代码风格， 支持HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C++, C#, Objective-C, CoffeeScript, TypeScript, and SQL等语言代码！**必备！！！**
file-icons
显示文件类型对应的图标，升级插件后可能需要重启Atom。
java-importer
帮助Java用户自动导入依赖的包。
验证你的 JavaScript ，写更专业的 JavaScript 代码。
CSSLint 会报告出不合规定的 CSS 规则！
CSSComb 的一个扩展工具， CSSComb 帮你写出更漂亮的 CSS ！
autoprefixer
AutoPrefix的一个扩展工具，自动为 CSS 属性添加特定的前缀。
手写 HTML 多少显得专业，但是手写的问题在于得大量的代码。Emmet大幅提升手写的效率。非常值得一装。
在Atom中使用vim!
sync-settings同步Atom
安装了这么多的插件，并且这么多的设置，如何备份同步呢？Atom并没有账号支持啊？其实，sync-settings插件可以完成相关工作，非常出色！
可以同步Atom的设置文件,自定义快捷键,用户风格,初始化脚本及代码片段,还支持已安装的插件同步
sync-settings 设置方法：
进入Atom设置中心找到该插件，进去setting；
打开自己的github创建一个 ， 然后复制生成的token序列， 粘贴到sync-settings插件的setting里面；
再打开github的gist服务，创建一个gist，并复制生成gist id（注意这个id就是你创建的gist服务对应的URL中除去你的用户名，之后的部分），也粘贴到sync-settings插件的setting里面
配置完毕后， 在文档编辑页面,按下全局命令搜索面板(Ctrl+shift+p)，搜索sync-，会有可选项：
sync-settings:backup – 这条命令是备份当前的配置
sync-settings:restore – 这条命令是回复配置,是直接覆盖的;
sync-settings:view-backup – 这条是当你执行备份后到线上查询你的备份的,也就是到你的gist code里面
sync-settings:check-backup – 这条是查询最后一次是否正常
效果图如下所示：
同步成功与失败的提示信息：
最后在Github中gist服务中多了许多Atom插件的备份配置信息，使用的是coffee脚本保存的，如图：
Atom提供的插件非常多，都来自于Github，遇到问题可以直接在Github上提问；
插件更新后，可能会失效，重启是个不错的解决办法 ；
推荐几个常用功能，默认已安装：
1&. ctrl + g: 只要 ctrl + g 后输入行号, 就能跳转到指定的行
2&. ctrl + shift + p: 调出功能详情，如按下快捷键后输入pane命令，查找split列表项，点击后实现分屏功能；
3&. Atom-Material这个主题真心不错，是Android material风格。
@@@@@@@@@@@@@@@@@—END—@@@@@@@@@@@@@@@@@
看过本文的人也看了：
我要留言技术领域：
取消收藏确定要取消收藏吗？
删除图谱提示你保存在该图谱下的知识内容也会被删除，建议你先将内容移到其他图谱中。你确定要删除知识图谱及其内容吗？
删除节点提示无法删除该知识节点，因该节点下仍保存有相关知识内容！
删除节点提示你确定要删除该知识节点吗？4109人阅读
Tools（17）
最近一直使用ATOM编辑器。因为这是免费的，并且和GIT配合非常好用。关键的是可以从sublime无缝的转换到这个编辑器来使用。
有一个问题就是，我们在编辑.vue这样的文件的时候，emmet语法得不到支持。这让我很憋屈。终于找到了解决方法。在这里分享给大家。
我的环境是MAC，但应该在windows和linux下是一样的才对。
进入终端编辑配置文件
vim ~/.atom/keymap.cson
这个文件默认有大段的注释。不用管，我们把光标放到最后一行，按 o 在最后一行后面再插入一行，将下面的代码粘贴进去
'atom-text-editor[data-grammar~="vue"]:not([mini])':
'tab': 'emmet:expand-abbreviation-with-tab'
然后按 esc退出编辑模式，再输入:wq保存退出，然后重启atom。然后你就会发现，在.vue的文件下面，支持emmet语法啦
原资料出处：
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：231770次
积分：3451
积分：3451
排名：第7756名
原创：100篇
转载：29篇
评论：70条
文章：11篇
阅读：13801
文章：53篇
阅读：168070
(7)(10)(1)(4)(1)(11)(9)(3)(18)(3)(7)(17)(9)(26)(7)}