vscode 设置代码片段
首先
- shift + ctrl + p
- 输入snippet
- 选择首选项:配置用户代码片段
- 新建全局代码片段文件
- 输入文件名
vue结构代码片段
{
"vue-template": { // vue-template 为快捷键的名字
// "scope": "vue-html", //这里可以设置作用域,只能在`<template>`里面显示 。不过我这个片段不需要设置
"prefix": "vue-template",
"body": [
"<template>",
" <div class='container'>",
" <h1>Template</h1>",
" </div>",
"</template>",
"",
"<script>",
"export default {",
" data () {",
" return {",
" ",
" }",
" },",
" props: {",
" prop: {",
" type: String,",
" required: false,",
" },",
" },",
" components: {",
" ",
" },",
" computed: {",
" ",
" },",
" watch: {",
" ",
" },",
" methods: {",
" // type your function",
" ",
" },",
" created () {",
" ",
" },",
" mounted () {",
" ",
" },",
" updated () {",
" ",
" },",
" destroyed () {",
" ",
" },",
" filters: {",
" ",
" },",
"}",
"</script>",
"",
"<style scoped lang=''>",
"",
"</style>",
"",
],
"description": "your build code"
}
}
这里可以根据自己的需求定义。保存好后,在vue文件里面输入tem
即可看到提示。