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個(gè)小時(shí)才找到問題

'.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 #############

暫時(shí)還不可以使用,原因未查明。。。。

'.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'
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,537評(píng)論 19 139
  • Awesome Ruby Toolbox Awesome A collection of awesome Ruby...
    debbbbie閱讀 3,085評(píng)論 0 3
  • PLEASE READ THE FOLLOWING APPLE DEVELOPER PROGRAM LICENSE...
    念念不忘的閱讀 13,650評(píng)論 5 6
  • 作者:王子亭 Atom 是 GitHub 在 2014 年發(fā)布的一款基于 Web 技術(shù)構(gòu)建的文本編輯器,我從 20...
    LeanCloud官方帳號(hào)閱讀 3,306評(píng)論 0 13
  • 兩周的見習(xí)緊張而忙碌。在這兩周期間,方源、程芳菲除了做好日常的工作學(xué)習(xí)之外,還協(xié)助見習(xí)學(xué)校組織了一場(chǎng)大型的藝術(shù)節(jié)匯...
    梅洛的聽雨軒閱讀 199評(píng)論 0 0

友情鏈接更多精彩內(nèi)容