【www.shanpow.com--简历下载】
第一篇atom编辑器:制作你的第一个 Atom 文本编辑器插件
Atom 编辑器 API
我们添加的代码通过用 TextEditor API 来访问编辑器内的文本并进行操作。让我们来仔细看看。
let editor
if (editor = atom.workspace.getActiveTextEditor()) { /* ... */ }
头两行代码获取了 TextEditor 实例的一个引用。变量的赋值和后面的代码被包在一个条件结构里，这是为了处理没有可用的编辑器实例的情况，例如，当用户在设置菜单中运行该命令时。
let selection = editor.getSelectedText()
调用 getSelectedText 方法可以让我们访问到用户选中的文本。如果当前没有文本被选中，函数将返回一个空字符串。
let reversed = selection.split("").reverse().join("")
editor.insertText(reversed)
我们选中的文本通过一个 JavaScript 字符串方法 来逆转。最后，我们调用 insertText 方法来将选中的文本替换为逆转后的文本副本。通过阅读 Atom API 文档，你可以学到更多关于 TextEditor 的不同的方法。
浏览骨架代码
现在我们已经完成第一次代码更改了，让我们浏览骨架代码包的代码来深入了解一下 Atom 的软件包是怎样构成的。
主文件
主文件是 Atom 软件包的入口文件。Atom 通过 package.json 里的条目设置来找到主文件的位置：
"main": "./lib/sourcefetch",
这个文件导出一个带有生命周期函数（Atom 在特定的事件发生时调用的处理函数）的对象。
activate 会在 Atom 初次加载软件包的时候调用。这个函数用来初始化一些诸如软件包所需的用户界面元素的对象，以及订阅软件包命令的处理函数。
deactivate 会在软件包停用的时候调用，例如，当用户关闭或者刷新编辑器的时候。
serialize Atom 调用它在使用软件包的过程中保存软件包的当前状态。它的返回值会在 Atom 下一次加载软件包的时候作为一个参数传递给 activate。
我们将会重命名我们的软件包命令为 fetch，并移除一些我们不再需要的用户界面元素。按照如下更改主文件：
"use babel";
import { CompositeDisposable } from "atom"
export default {
subscriptions: null,
activate() {
this.subscriptions = new CompositeDisposable()
this.subscriptions.add(atom.commands.add("atom-workspace", {
"sourcefetch:fetch": () => this.fetch()
}))
},
deactivate() {
this.subscriptions.dispose()
},
fetch() {
let editor
if (editor = atom.workspace.getActiveTextEditor()) {
let selection = editor.getSelectedText()
selection = selection.split("").reverse().join("")
editor.insertText(selection)
}
}
};
“启用”命令
为了提升性能，Atom 软件包可以用时加载。我们可以让 Atom 在用户执行特定的命令的时候才加载我们的软件包。这些命令被称为 启用命令，它们在 package.json 中定义：
"activationCommands": {
"atom-workspace": "sourcefetch:toggle"
},
更新一下这个条目设置，让 fetch 成为一个启用命令。
"activationCommands": {
"atom-workspace": "sourcefetch:fetch"
},
有一些软件包需要在 Atom 启动的时候被加载，例如那些改变 Atom 外观的软件包。在那样的情况下，activationCommands 会被完全忽略。
“触发”命令
菜单项
menus 目录下的 JSON 文件指定了哪些菜单项是为我们的软件包而建的。让我们看看 menus/sourcefetch.json：
"context-menu": {
"atom-text-editor": [
{
"label": "Toggle sourcefetch",
"command": "sourcefetch:toggle"
}
]
},
这个 context-menu 对象可以让我们定义右击菜单的一些新条目。每一个条目都是通过一个显示在菜单的 label 属性和一个点击后执行的命令的 command 属性来定义的。
"context-menu": {
"atom-text-editor": [
{
"label": "Fetch code",
"command": "sourcefetch:fetch"
}
]
},
同一个文件中的这个 menu 对象用来定义插件的自定义应用菜单。我们如下重命名它的条目：
"menu": [
{
"label": "Packages",
"submenu": [
{
"label": "sourcefetch",
"submenu": [
{
"label": "Fetch code",
"command": "sourcefetch:fetch"
}
]
}
]
}
]
键盘快捷键
命令还可以通过键盘快捷键来触发。快捷键通过 keymaps 目录的 JSON 文件来定义：
{
"atom-workspace": {
"ctrl-alt-o": "sourcefetch:toggle"
}
}
以上代码可以让用户通过 Ctrl+Alt+O（Windows/Linux） 或 Cmd+Alt+O（MacOS） 来触发 toggle 命令。
重命名引用的命令为 fetch：
"ctrl-alt-o": "sourcefetch:fetch"
通过执行 Window: Reload 命令来重启 Atom。你应该会看到 Atom 的右击菜单更新了，并且逆转文本的功能应该还可以像之前一样使用。
在 sourcefetch 教程仓库 查看这一步所有的代码更改。
使用 NodeJS 模块
现在我们已经完成了第一次代码更改并且了解了 Atom 软件包的结构，让我们介绍一下 Node 包管理器（npm） 中的第一个依赖项模块。我们将使用 request 模块发起 HTTP 请求来下载网站的 HTML 文件。稍后将会用到这个功能来扒 StackOverflow 的页面。
安装依赖
打开你的命令行工具，切换到你的软件包的根目录并运行：
npm install --save [email protected]
apm install
这两条命令将 request 模块添加到我们软件包的依赖列表并将模块安装到 node_modules 目录。你应该会在 package.json 看到一个新条目。@ 符号的作用是让 npm 安装我们这篇教程需要用到的特定版本的模块。运行 apm install 是为了让 Atom 知道使用我们新安装的模块。
"dependencies": {
"request": "^2.73.0"
}
下载 HTML 并将记录打印在开发者控制台
通过在 lib/sourcefetch.js 的顶部添加一条引用语句引入 request 模块到我们的主文件：
import { CompositeDisposable } from "atom"
import request from "request"
现在，在 fetch 函数下面添加一个新函数 download 作为模块的导出项：
export default {
/* subscriptions, activate(), deactivate() */
fetch() {
...
},
download(url) {
request(url, (error, response, body) => {
if (!error && response.statusCode == 200) {
console.log(body)
}
})
}
}
这个函数用 request 模块来下载一个页面的内容并将记录输出到控制台。当 HTTP 请求完成之后，我们的回调函数会将响应体作为参数来被调用。
最后一步是更新 fetch 函数以调用 download 函数：
fetch() {
let editor
if (editor = atom.workspace.getActiveTextEditor()) {
let selection = editor.getSelectedText()
this.download(selection)
}
},
fetch 函数现在的功能是将 selection 当作一个 URL 传递给 download 函数，而不再是逆转选中的文本了。让我们来看看这次的更改：
通过执行 Window: Reload 命令来重新加载 Atom。
打开开发者工具。为此，导航到菜单中的 View > Developer > Toggle Developer Tools。
新建一个文件，导航到 File > New。
输入一个 URL 并选中它，例如：http://www.atom.io。
用上述的任意一种方法执行我们软件包的命令：
开发者工具让 Atom 软件包的调试更轻松。每个 console.log 语句都可以将信息打印到交互控制台，你还可以使用 Elements 选项卡来浏览整个应用的可视化结构——即 HTML 的文本对象模型（DOM）。
在 sourcefetch 教程仓库 查看这一步所有的代码更改。
第二篇atom编辑器:Atom编辑器折腾记
启动界面
菜单栏-分为六大块:
File — 文件的保存打开,项目的保存打开,最后一次的项目加载,关闭及设置中心,以及用户自定义的配置(配置文件,初始化脚本,样式风格,代码片段,快捷键配置文件)等
Edit — 文件编辑的操作,文件编码格式,及行跳转等
View — 重载页面,全屏,字体大小的缩放等
Find — 都是关于查询的 ,跟Sublime text极其相似,快捷键基本一样
Package — 包,就是插件列表的集合点
Help — 帮助文档,软件更新,协议等
设置中心-File=>Settings
左边侧栏,自上而下分为六大部分:
Settings — 全局设置,可以设置文件的编码,菜单栏是否显示,忽略文件,文档缩进,字体大小,项目主目录等,这个比sublime text人性化,简洁明了的配置
Keybindings — 快捷键配置,默认快捷键都汇总于此了,很方便查询对应的快捷键的功能,也方便修改…人性化
Packages — 插件管理中心,可以设置插件,删除插件及禁用,无安装功能
Themes —主题管理中心,可以设置主题(支持鼠标选定,也支持写入配置文件生效),管理主题(删除及在线下载主题)
Updates — 目前功能只有一个,查询社区包的状态,随时随地的更新已安装的插件,ATOM软件的更新在HELP里面
Install — 目前分为两栏,自上而下,第一部分是搜索(可以搜索社区的插件),下面一部分会展示目前比较流行的插件(可以直接点击下载使用)
Open Config Folder — 这一块算不上鼠标操作控制,完全是软件的配置文件集合目录
值得注意的是,配置文件的后缀是cson,而不是JSON,但是书写规范又很相似,,醉了…估计是社区搞出来的
常用快捷键–亲测及翻译
英文
中文
快捷键
功能
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 + |Sublime的Ctrl+K,+B这里也可以生效
Toggle Commadn palette
全局搜索面板
Ctrl + Shift + P
和Sublime的大同小异
Select Line
选定一行
Ctrl + L
如中文意思
Select First Character of Line
选定光标至行首
Shift + Home
如中文意思
Slect 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一模一样有木有
Find 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
如中文意思
比较新奇的功能,,眼前一亮啊!!似曾相识有木有,CHROME的web调试器!!!
还有一些我还没搞清楚到底是什么作用,或者压根就是还没有生效,估计正式版会完善些
第三篇atom编辑器:一款值得永久收藏的开源免费功能强大的文本代码编辑器——ATOM
近几年，业界比较流行的文本代码编辑器当属Sublime，速度快，支持插件扩展，关键字提示，也支持很多的平台，Windows，Linux和OSX，下面是其具体的一些信息。
Url地址: https://www.sublimetext.com/
成本: $70 美元
开发者: Jon Skinner former Google Engineer
支持的平台: OSX, Windows, Linux
另外，Sublime的包的管理，其实做的还是挺不错的。
Sublime的的确确好用，但是就是有一个用户心中的永远的痛，就是收费，收费，收费。重要的话说三遍。如果使用盗版风险太大，买的话又有点贵，特别对个人用户来说。
那有没有一款免费开源的产品，能跨平台，功能强大，自动支持Git，代码高亮显示，且支持插件化扩展。答案肯定就是Yes。 那就是ATOM。
ATOM的身份信息如下，简直逆天了。
官网: https://atom.io/
成本: 免费(MIT Licence)
开发者: GitHub
支持的平台: OSX, Windows, Linux
被称为是21世纪最牛逼的文本编辑器，没有之一。Github的ATOM其主要牛逼的特性如下：
其中，最包管理和代码高亮显示和自动完成重点说一下。
包管理
和Sublime支持包的自动安装和扩展。
代码自动补全 代码界面感觉看起来十分的舒服，代码补全功能也十分的流畅，下面就是一个React的代码自动补全的例子。
最后给大家提个引子，你知道Github ATOM是基于什么语言画的界面的吗？ 答案出乎你的意料，html+CSS+Javascript
下次有时间好好给读者撇撇：
如果你对这个编辑器感兴趣的话，请收藏并关注我的公众号；
如果你有任何欢迎在文章末尾留言，我尽量在第一时间个大家回复。
