vsCode 使用快捷键创建vue组件

520 阅读1分钟
  1. 打开vscode
  2. ctrl+shift+p 进入选项
  3. 找到配置用户代码片段
  4. 输入vue 进入到一个vue.json
  5. 将下面代码复制到vue.json里
/*可以根据自身需求修改*/
    {
	"Print to console": {
		"prefix": "vue",
		"body": [
			"<template>",
			"  <div class=\"wrapper\">$0</div>",
			"</template>",
			"",
			"<script>",
			"export default {",
			"  components: {},",
			"  props: {},",
			"  data() {",
			"    return {",
			"    };",
			"  },",
			"  watch: {},",
			"  computed: {},",
			"  methods: {},",
			"  created() {},",
			"  mounted() {}",
			"};",
			"</script>",
			"<style lang=\"scss\" scoped>",
			".wrapper{}",
			"</style>"
		],
		"description": "A vue file template"
	}
}

然后新建一个vue文件 输入vue得到下面模板

    <template>
	<div class="wrapper"></div>
</template>

<script>
export default {
	components: {},
	props: {},
	data() {
		return {};
	},
	watch: {},
	computed: {},
	methods: {},
	created() {},
	mounted() {},
};
</script>
<style lang="scss" scoped>
.wrapper {
}
</style>

根据自需求来使用 less 或者sass

现在你可以使用模板来快捷的创建vue了