ATOM自定义代码段

2016-08-10  本文已影响0人  昵称不能太随便

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': '<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">'
'description': "for mobile"

'HTML':
'prefix': 'html2'
'body': '''
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title></title>
<style media="screen">
$2
</style>
</head>
<body>

            $1

        </body>
        <script type="text/javascript">
            $3
        </script>
    </html>
'''
'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'
上一篇 下一篇

猜你喜欢

热点阅读