使用vscode添加vue模板步驟示例

Posted on by

在vscode中輸入vue生成vue文件的模板

效果

在vscode中輸入vue可以代碼補全

步驟

打開vscode

新建一個vue文件

文件–>首選項—>用戶代碼片段

在彈出的搜索框中輸入vue,並點擊

粘貼一下內容,並保存

{
	"Print to console": {
		"prefix": "vue",
		"body": [
			"<template>",
			"<div></div>",
			"</template>",
			"",
			"<script>",
			"",
			"export default {",
			"name: '' ,",
			"components: {},",
			"props:['list'],",
			"data() {",
			"return {",
			"",
			"}",
			"},",
			"computed: {},",
			"watch: {},",
			"created() {",
			"",
			"},",
			"mounted() {",
			"",
			"},",
			"beforeCreate() {",
			"",
			"},",
			"beforeMount() {",
			"",
			"},",
			"beforeUpdate() {",
			"",
			"}, ",
			"updated() {",
			"",
			"}, ",
			"beforeDestroy() {",
			"",
			"},",
			"destroyed() {",
			"",
			"},",
			"activated() {",
			"",
			"},",
			"methods: {",
			"",
			"}",
			"}",
			"</script>",
			"<style lang='less' scoped>",
			"$4",
			"</style>"
		],
		"description": "Log output to console"
	}
}

新建一個index.vue文件

輸入vue按回車或點擊

以上就是使用vscode添加vue模板步驟示例的詳細內容，更多關於vscode添加vue模板的資料請關註WalkonNet其它相關文章！

推薦閱讀：