ATOM自定义代码段

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'

Each scope (e.g. '.source.coffee' above) can only be declared once.

This file uses CoffeeScript Object Notation (CSON).

If you are unfamiliar with CSON, you can read more about it in the

Atom Flight Manual:

https://atom.io/docs/latest/using-atom-basic-customization#cson

############# HTML #############

注意：在HTML文档中，不能使用.source.html 而是使用 .text.html !!!!! 查了2个小时才找到问题

'.text.html':
'viewport':
'prefix': 'viewport'
'body': ''
'description': "for mobile"

'HTML':
'prefix': 'html2'
'body': '''

            $1

        
        
    
'''
'description': 'html init with script and css'

############# CSS #############

暂时还不可以使用，原因未查明。。。。

'.source.css':
'Multiline comment':
'prefix': '///'
'body': '''
/*
$1
*/
'''

############# JS #############
'.source.js':
'document.write()':
'prefix': 'write'
'body': 'document.write("$1");'
'get element by id':

'prefix': 'gi'
'body': 'document.getElementById("$1");'
'description': 'get element by id'

'query selector':

'prefix': 'qs'
'body': 'document.querySelector("$1");'
'description': 'query element by selector'

'query selector all':

'prefix': 'qsa'
'body': 'document.querySelectorAll("$1");'
'description': 'get elements by querySelectorAll'