It is super simple to add your own snippets to Atom. You can either create them as a json file, or the default cson format. The snippets file is located in your home directory in the .atom
folder:
vim ~/.atom/snippets.cson
I was sick of typing use strict
, module.exports
, describe
, and it
this morning so I started writing some snippets.
The commented message at the top of the cson file has some good tips too:
# Your snippets
#
# Atom snippets allow you to enter a simple prefix in the editor and hit tab to
# expand the prefix into a larger code block with templated values.
#
# You can create a new snippet in this file by typing "snip" and then hitting
# tab.
#
# An example CoffeeScript snippet to expand log to console.log:
#
# '.source.coffee':
# 'Console log':
# 'prefix': 'log'
# 'body': 'console.log $1'
#
# This file uses CoffeeScript Object Notation (CSON).
# If you are unfamiliar with CSON, you can read more about it here:
# https://github.com/bevry/cson#what-is-cson
I started with use strict
and module.exports
:
'.source.js':
'Use strict':
'prefix': 'strict'
'body': '\'use strict\';'
'Module.exports':
'prefix': 'module'
'body': 'module.exports = '
Then I went on to use tabs. When you tab to trigger the snippet to be included, the tab is the default position for the cursor to appear. You can specify multiple tab positions by incrementing the value after the $
. So when I use describe
I want the cursor to appear in the description parameter, then when I'm done with the title I want to tab straight to the body of the callback function.
In order to write a multiline snippet you need to use tripple double quotes """
.
'.source.js':
'Use strict':
'prefix': 'strict'
'body': '\'use strict\';'
'Module.exports':
'prefix': 'module'
'body': 'module.exports = '
'Describe':
'prefix': 'describe'
'body': """
describe('$1', () => {
$2
});
"""
'It':
'prefix': 'it'
'body': """
it('$1', () => {
$2
});
"""
'Tape':
'prefix': 'test'
'body': """
test('$1', assert => {
assert.$2($3, $4, '$5');$6
});
"""
Super easy.