03的开发日志
0%

【VS Code模板（snippet）】Vue CLI 开发模式 通用模板

发表于 更新于 分类于
本文字数： 2.5k 阅读时长 ≈ 2 分钟

仅作为一个记录，这是如何设置代码片段的博文：VS code自定义用户代码片段snippet

  1. 包括模块声明
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
"Vue CDN Test Template": {
    "prefix": "Vue Test",
    "body": [
        "<!DOCTYPE html>",
        "<html lang=\"en\">",
        "<head>",
        "    <meta charset=\"UTF-8\">",
        "    <title>${0: Test Name} | Vue CDN Test</title>",
        "    <script src=\"./Vue.js/2.5.17/vue.js\"></script>",
        "    ",
        "    <script>",
        "            // 注册组件的script放在头文件中预渲染",
        "        Vue.component('', {",
        "            props: [],",
        "            template: ''",
        "        })",
        "    </script>",
        "    ",
        "</head>",
        "<body>",
        "    ",
        "    <div id=\"app\">",
        "    ",
        "    </div>",
        "    ",
        "    <script>",
        "        var vm = new Vue({",
        "            el: '#app',",
        "            data() {",
        "                return {",
        "                    ",
        "                }",
        "            },",
        "            methods: {",
        "                ",
        "            }",
        "        })",
        "    </script>",
        "    ",
        "</body>",
        "</html>",
    ],
    "description": "Vue CDN Test html template"
}
  1. 不包括模块声明
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
"Vue CDN Test Template No Component": {
    "prefix": "Vue Test No Component",
    "body": [
        "<!DOCTYPE html>",
        "<html lang=\"en\">",
        "<head>",
        "    <meta charset=\"UTF-8\">",
        "    <title>${0: Test Name} | Vue CDN Test</title>",
        "    <script src=\"./Vue.js/2.5.17/vue.js\"></script>",
        "</head>",
        "<body>",
        "    ",
        "    <div id=\"app\">",
        "    ",
        "    </div>",
        "    ",
        "    <script>",
        "        var vm = new Vue({",
        "            el: '#app',",
        "            data() {",
        "                return {",
        "                    ",
        "                }",
        "            },",
        "            methods: {",
        "                ",
        "            }",
        "        })",
        "    </script>",
        "    ",
        "</body>",
        "</html>",
    ],
    "description": "Vue CDN Test html template"
}