vscode代码模板(vue3模板)输入vue3显示代码提示
【代码】vscode代码模板(vue3模板)输入vue3显示代码提示。
·
途径一:在vscode中依次打开:【文件】-->【首选项】-->【配置用户代码片段】-->【新代码片段】
途径二:或者点击左下角的设置模样的按钮也可找到(如下图)
然后点击vue.json
如果没设置过的话就像下图一样;配置过的应该也知道后面的步骤了
贴入下面代码
{
// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
// "Print to console": {
// "prefix": "log", //log为快捷名称
// "body": [
// "console.log('$1');",//body中就是输入快捷名称并且选择时快捷生成的代码模板
// "$2"
// ],
// "description": "Log output to console"
// }
"Print to console": {
"prefix": "vue3",
"body": [
"<template>",
" <div></div>",
"</template>",
"",
"<script setup>",
"import { ref, reactive, getCurrentInstance } from 'vue';",
"const { proxy } = getCurrentInstance()",
"</script>",
"",
"<style scoped lang='scss'>",
"</style>"
],
"description": "Log output to console"
}
}
快捷键:ctrl+s;保存好文件就可以用了
当我们选择vue3时就可快速生成代码模板body中的代码了,如下图
就此完成;
只为记录学习中的问题
更多推荐
已为社区贡献2条内容
所有评论(0)