Vs Code Vue、Html模板生成（设置用户片段）
程序员文章站
2022-07-05 20:01:19
...
一、目的
使用Vscode编辑器，创建文件很是常见，使用模板文件可以提高效率。下面以创建Vue模板文件为例。并附上Html配置的代码
二、使用步骤
1.打开VsCode—首选项—用户片段。
2.搜索Vue—打开Vue.json文件并添加以下代码
Vue.json代码如下：
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div class='$1'></div>",
"</template>",
"",
"<script>",
"export default {",
" name: '$1',",
" data () {",
" return {}",
" },",
" components: {},",
" created () {},",
" mounted () {},",
" methods: {}",
"}",
"</script>",
"<style lang='stylus' scoped>",
"</style>",
""
],
"description": "Vue template" }}
Html模板文件的代码如下。
{
"Print to console": {
"prefix": "html",
"body": [
"<!DOCTYPE html>",
" <html>",
" <head>",
" <meta charset='utf-8'>",
" <title></title>",
" </head>",
" <body>",
" </body>",
" </html>"
],
"description": "html template" }
}三、测试效果
- 输入vue并敲击Enter，文件中自动生成模板代码。如下图所示。
- 成功界面如下：
加油撒！！！
上一篇： 计算机组成原理（下）
下一篇： 统计字符串中字符出现的个数。