emmet前端模板

https://github.com/emmetio/emmet/blob/master/lib/snippets.json

"emmet.extensionsPath": "D:\myTools\vscode",  vscode 下面有snippets.json

下面是 vscode的 snippets.json 文件

{
  "variables": {
    "lang": "en",
    "locale": "en-US",
    "charset": "UTF-8",
    "indentation": "	",
    "newline": "
"
  },
  "html": {
    "filters": "html",
    "profile": "html",
    "snippets": {
      "!!!": "<!DOCTYPE html>",
      "!!!4t": "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">",
      "!!!4s": "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">",
      "!!!xt": "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">",
      "!!!xs": "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">",
      "!!!xxs": "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">",
      "c": "<!-- |${child} -->",
      "cc:ie6": "<!--[if lte IE 6]>
	${child}|
<![endif]-->",
      "cc:ie": "<!--[if IE]>
	${child}|
<![endif]-->",
      "cc:noie": "<!--[if !IE]><!-->
	${child}|
<!--<![endif]-->",
      "boilerplate": "<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->
",
      "myfavicon": "<link rel="shortcut icon" type="image/ico" href="" />",
      "myviewport": "<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!--移动端视图-->",
      "360compat": "<meta name="renderer" content="webkit" />",
      "mykeywords": "<meta name="keywords" content="ajanuw" /> <!--关键词-->",
      "mydesc": "<meta name="description" content="ajanuw, b,c" /> <!--网站内容描述-->",
      "meta0": "<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />",
      "meta1": "<meta http-equiv="Pragma" content="no-cache" /> <!--禁止浏览器从本地计算机的缓存中访问页面内容-->",
      "meta2": "<meta http-equiv="Window-target" content="_top" /> <!--强制页面在当前窗口以独立页面显示-->",
      "meta3": "<meta http-equiv="content-Type" content="text/html;charset=utf-8" />  <!--显示字符集的设定-->",
      "meta4": "<meta http-equiv="Content-Language" content="zh-cn"/>   <!--显示语言的设定-->",
      "meta5": "<meta http-equiv="imagetoolbar" content="false" />  <!--指定是否显示图片工具栏,false不显示,true显示-->",
      "meta6": "<link rel="icon" sizes="192x192" href='https://i.screenshot.net/p/33oq6u0?a1996686e62a47ce9b2728ac831e58d2' />",
      "meta7": "<link rel="apple-touch-icon" href='https://i.screenshot.net/p/33oq6u0?a1996686e62a47ce9b2728ac831e58d2' />",
      "meta8": "<meta name="msapplication-square310x310logo" content='https://i.screenshot.net/p/33oq6u0?a1996686e62a47ce9b2728ac831e58d2' />",
      "meta9": "<meta name="theme-color" content="#ff4081" />",
      "meta10": "<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />   <!-- Chrome, Firefox OS and Opera -->",
      "meta11": "<link rel="apple-touch-startup-image" href='https://i.screenshot.net/p/33oq6u0?a1996686e62a47ce9b2728ac831e58d2' />",

      "react": "<script src='https://unpkg.com/react@latest/umd/react.development.js' crossorigin='anonymous'></script> <script src='https://unpkg.com/react-dom@latest/umd/react-dom.development.js' crossorigin='anonymous'></script> <script src='https://unpkg.com/@material-ui/core/umd/material-ui.development.js' crossorigin='anonymous'></script> <script src='https://unpkg.com/babel-standalone@latest/babel.min.js' crossorigin='anonymous'></script><link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto:300,400,500' /><link rel='stylesheet' href='https://fonts.googleapis.com/icon?family=Material+Icons'>",

      "metas": "myfavicon+myviewport+360compat+mykeywords+mydesc+meta0+meta1+meta2+meta3+meta4+meta5+meta6+meta7+meta8+meta9+meta10+meta11+react
",
      "ajanuw": "{<!DOCTYPE html>}+{<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->}+html[lang=en]>(head>meta[charset='utf-8']+title{${1:ajanuw}}+metas)+body>{
 <!--[if lt IE 8]>  <h3>请升级你的浏览器,或更换主浏览器!!!</h3>  <![endif]-->}+div#root"
    }
  }
}

autoload/emmet.vim配置模板

需要配合 !使用, 关键命令 myheade,mybody,myalert

        'snippets': {
            '!': "html:5",
            '!!!': "<!DOCTYPE html>
",
            '!!!4t':  "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
",
            '!!!4s':  "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
",
            '!!!xt':  "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
",
            '!!!xs':  "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
",
            '!!!xxs': "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
",
            'c': "<!-- |${child} -->",
            'cc:ie6': "<!--[if lte IE 6]>
	${child}|
<![endif]-->",
            'cc:ie': "<!--[if IE]>
	${child}|
<![endif]-->",
            'cc:noie': "<!--[if !IE]><!-->
	${child}|
<!--<![endif]-->",
            "boilerplate": "<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->
",
            "myfavicon": "<link rel="shortcut icon" type="image/ico" href="" />",
            "myviewport": "<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!--移动端视图-->
",
            "mykeywords": "<meta name="keywords" content="ajanuw" /> <!--关键词-->
",
            "mydesc": "<meta name="description" content="ajanuw, b,c" /> <!--网站内容描述-->
",
            "meta0": "<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
",
            "meta1": "<meta http-equiv="Pragma" content="no-cache" /> <!--禁止浏览器从本地计算机的缓存中访问页面内容-->
",
            "meta2": "<meta http-equiv="Window-target" content="_top" /> <!--强制页面在当前窗口以独立页面显示-->
",
            "meta3": "<meta http-equiv="content-Type" content="text/html;charset=utf-8" />  <!--显示字符集的设定-->
",
            "meta4": "<meta http-equiv="Content-Language" content="zh-cn"/>   <!--显示语言的设定-->
",
            "meta5": "<meta http-equiv="imagetoolbar" content="false" />  <!--指定是否显示图片工具栏,false不显示,true显示-->
",
            "meta6": "<link rel="icon" sizes="192x192" href="https://pic.cnblogs.com/avatar/1053296/20171128213246.png" />
",
            "meta7": "<link rel="apple-touch-icon" href="https://pic.cnblogs.com/avatar/1053296/20171128213246.png" />
",
            "meta8": "<meta name="msapplication-square310x310logo" content="https://pic.cnblogs.com/avatar/1053296/20171128213246.png" />
",
            "meta9": "<meta name="theme-color" content="#ff4081" />
",
            "meta10": "<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />   <!-- Chrome, Firefox OS and Opera -->
",
            "meta11": "<link rel="apple-touch-startup-image" href="https://pic.cnblogs.com/avatar/1053296/20171128213246.png" />
",
            "ons_css":"<link href="https://cdn.bootcss.com/onsen/2.10.0/css/onsenui.css" rel="stylesheet">
",
            "ons_component":"<link href="https://cdn.bootcss.com/onsen/2.10.0/css/dark-onsen-css-components.css" rel="stylesheet">
",
            "ons_js":"<script src="https://cdn.bootcss.com/onsen/2.10.0/js/onsenui.min.js"></script>
",
            "ons": "ons_css+ons_component+ons_js
",
            "icons": "<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
",
            "bt_mdcss": "<link rel="stylesheet" href="https://unpkg.com/bootstrap-material-design@4.1.1/dist/css/bootstrap-material-design.min.css" integrity="sha384-wXznGJNEXNG1NFsbm0ugrLFMQPWswR3lds2VeinahP8N0zJw9VWSopbjv2x7WCvX" crossorigin="anonymous">
",
            "vue": "<script src="https://cdn.bootcss.com/vue/2.5.16/vue.js"></script>
",
            "vueRouter": "<script src="https://cdn.bootcss.com/vue-router/3.0.1/vue-router.min.js"></script>
",
            "jq_slim": "<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
",
            "popper": "<script src="https://unpkg.com/popper.js@1.12.6/dist/umd/popper.js" integrity="sha384-fA23ZRQ3G/J53mElWqVJEGJzU0sTs+SvzG8fXVWP+kJQ1lwFAOkcUOysnlKJC33U" crossorigin="anonymous"></script>
",
            "bt_mdjs": "<script src="https://unpkg.com/bootstrap-material-design@4.1.1/dist/js/bootstrap-material-design.js" integrity="sha384-CauSuKpEqAFajSpkdjv3z9t8E7RlpJ1UP0lKM/+NdtSarroVKu069AlsRPKkFBz9" crossorigin="anonymous"></script>
",
            "lodash": "<script src="https://cdn.bootcss.com/lodash.js/4.17.10/lodash.min.js"></script>
",
            "json5": "<script src="https://cdn.bootcss.com/json5/0.5.1/json5.min.js"></script>
",
            "rxjs": "<script src="https://cdn.bootcss.com/rxjs/6.1.0/rxjs.umd.min.js"></script>
",
            "metas": "myfavicon+myviewport+mykeywords+mydesc+meta0+meta1+meta2+meta3+meta4+meta5+meta6+meta7+meta8+meta9+meta10+meta11 
",
            "mydoc": "{<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]-->
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]-->
<!--[if IE 8]><html class="no-js lt-ie9"><![endif]-->
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]-->}+html[lang='zh-cmn-Hans']>(head>meta[charset='utf-8']+title{${1:ajanuw}}+metas+icons+bt_mdcss)+body>{
 <!--[if lt IE 8]>  <h3>请升级你的浏览器,或更换主浏览器!!!</h3>  <![endif]-->}+vue+lodash+rxjs
",
            "ajanuw": "mydoc",
            'html:4t': "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
"
                    ."<html lang="${lang}">
"
                    ."<head>
"
                    ."	<meta http-equiv="Content-Type" content="text/html;charset=${charset}">
"
                    ."	<title></title>
"
                    ."</head>
"
                    ."<body>
	${child}|
</body>
"
                    ."</html>",
            'html:4s': "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
"
                    ."<html lang="${lang}">
"
                    ."<head>
"
                    ."	<meta http-equiv="Content-Type" content="text/html;charset=${charset}">
"
                    ."	<title></title>
"
                    ."</head>
"
                    ."<body>
	${child}|
</body>
"
                    ."</html>",
            'html:xt': "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
"
                    ."<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="${lang}">
"
                    ."<head>
"
                    ."	<meta http-equiv="Content-Type" content="text/html;charset=${charset}" />
"
                    ."	<title></title>
"
                    ."</head>
"
                    ."<body>
	${child}|
</body>
"
                    ."</html>",
            'html:xs': "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
"
                    ."<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="${lang}">
"
                    ."<head>
"
                    ."	<meta http-equiv="Content-Type" content="text/html;charset=${charset}" />
"
                    ."	<title></title>
"
                    ."</head>
"
                    ."<body>
	${child}|
</body>
"
                    ."</html>",
            'html:xxs': "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
"
                    ."<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="${lang}">
"
                    ."<head>
"
                    ."	<meta http-equiv="Content-Type" content="text/html;charset=${charset}" />
"
                    ."	<title></title>
"
                    ."</head>
"
                    ."<body>
	${child}|
</body>
"
                    ."</html>",
            'html:5': "<!DOCTYPE html>
"
                    ."<html lang="${lang}">
"
                    ."<head>
"
                    ."	<meta charset="${charset}">
"
                    ."	<title></title>
"
                    ."</head>
"
                    ."<body>
	${child}|
</body>
"
                    ."</html>",
        },
原文地址:https://www.cnblogs.com/ajanuw/p/8390427.html