代码片段 .scss
{
"水平排布": {
"prefix": "just",
"body": [
"justify-content: space-around;",
],
"description": "水平排布"
},
"计算像素": {
"prefix": "ca",
"body": [
"calc();",
],
"description": "计算像素"
},
"flex布局,两侧顶边": {
"prefix": "fs",
"body": [
"display: flex;",
"flex-wrap: wrap;",
"justify-content: space-between;"
],
"description": "flex布局,两侧顶边"
},
"flex布局,两侧留宽": {
"prefix": "fa",
"body": [
"display: flex;",
"flex-wrap: wrap;",
"justify-content: space-around;"
],
"description": "flex布局,两侧顶边"
},
"flex布局,居中": {
"prefix": "fc",
"body": [
"display: flex;",
/* 启用 flex 布局 */
"justify-content: center;",
/* 主轴(默认水平方向)居中 */
"align-items: center;",
/* 交叉轴(默认垂直方向)居中 */
],
"description": "flex布局,两侧顶边"
}
}
代码片段 .vue
{
"vue2初始模板": {
"prefix": "v2", //这里是定义快速呼起指定代码片段的名称
"body": [
"<template>",
" <div class='$1'>$2</div>",
"</template>",
"<script>",
"// import '@/assets/css/common.css';",
"// import EmoTable from '@/components/table/index';",
"export default {",
" name: '$3',",
" components: {",
" // EmoTable,",
" },",
" data() {",
" return {",
" }",
" },",
" methods: {",
" },",
" computed: {",
" },",
" onMounted() {",
" },",
" created() {",
" },",
" beforeDestroy() {",
" }",
"};",
"</script>",
],
"description": "vue2初始模板"
},
"vue3的ts模板": {
"prefix": "v3", //键入该值,按tab快捷产生
"body": [
"<template>",
" <div class='${1:className}-container'>",
" <h1>${1:className}</h1>",
" </div>",
"</template>",
"",
"<script setup lang='ts'>",
"//import '@/css/parentName/${1:className}.scss'",
"//import { optionsName } from './echartsOptions'",
"import { ref,reactive } from 'vue'",
"</script>",
],
"description": "vue3的ts模板"
},
"卡片样式Div": {
"prefix": "card", //键入该值,按tab快捷产生
"body": [
"<div class=\"${1:className} card border-1px\">",
"</div>"
],
"description": "vue3的ts模板"
}
}