自定义代码片断

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

我们可以根据自己的需要去定义一些代码片断 .. 打开 Atom 菜单,找到 Open Your Snippets .. 这样会打开 snippets.cson 这个文件,在这个文件里, 我们可以自己去定义代码片断 ..

首先要指定一下这个代码片断应用的范围 .. 这个范围是语言包里定义的,比如打开 JavaScript 这个语言包 .. 这里显示的 Scope 就是我们要使用的范围 ..

再回到 snippets.cson .. 用一组引号,输入 .source.js .. 表示这个代码片断用在 JavaScript 文件上 .. 后面是一个冒号 .. 另起一行 .. 缩进一下 .. 然后设置一下这个代码片断的描述 .. 这个描述会显示在代码片断的面板上 ..

比如我想定义一个 ES6 里面的导入模块用的代码片断 .. ES6 module import .. 再另起一行 .. 设置一下触发这个代码片断的缩写形式 .. 用一个 prefix .. 它的值设置成的 mi ,表示 module import ..

后面不需要冒号 .. 再另起一行 .. 设置一下代码片断的主体部分 .. 用一个 body .. 一组引号 .. 它里面的东西就是,输入 mi 按一下 tab 以后生成的代码片断 ..

import .. 后面是给要导入的模块起的名字 .. 这里用一个 $ 大括号 .. 输入一个1 冒号 .. NAME .. 这块的意思就是,默认会显示 NAME 这个字符,$1 表示按一下 tab 跳到的地方,也就是默认就可以直接去编辑 NAME 这个地方的值 ..

后面加上一个 from .. 然后是一组引号,引号里面是模块的位置 .. 要输入引号需要用一个转义符 .. 一个斜线 .. 后面加上一个引号 .. 再用一个斜线,后面又是一个引号 .. 中间这里,用一个 $2 ,表示按两个 tab 会跳到的地方 .. 最后是一个分号 ..

现在我们就定义好了一个代码片断 .. 触发它的简写形式是 mi .. 保存 .. 打开一个 js 文件 .. 输入 mi .. 按一下 tab ..

会生成 ES6 里面导入模块的写法 .. 现在可以直接输入模块导入进来的名字 .. React .. 再按一下 tab .. 会转到后面的引号里面 .. 因为在定义这个代码片断的时候,这里用了一个 $2 .. 在这里,可以输入模块的位置 .. react-native ..

自定义代码片断《 Atom:代码编辑器 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点