常用插件

1. Auto Close Tag 自动标签闭合

2. Auto Rename Tag 自动生成标签名字 Tab

3. Chinese (Simplified) Language Pack for VS Code 中文版

4. CSS Peek css路径查看

5. ESLint 这个开发约束

6. Eva Theme 主题比较好看

7. GitLens 这是管理git源代码的插件，可以简化git提交,配合Git Histroty 可以到看到历史信息，要注意的是如果你用git 那么用手动比较好

git init
git add .
git commit -m 'first commit'
git remote add origin 你的远程厂库地址
git push -u origin maste  推送到你的远程厂库
这个时候你的本地厂库和远程厂库完成创建并且已经关联好了

git branch dev
git checkout dev
git push origin dev
git branch -r   查看远程连接
git branch -v   查看本地连接
git merge dev  合并自定分支到当前分支，把dev分支上的代码合并到master上
这里基本的操作可以开发使用，遇到其他问题直接网上解决

8. Highlight Matching Tag 选择的标签有高亮的效果，布局的时候标签太多可以用

9. HTML CSS Hupport 智能提示CSS类名以及id

10. Live Server 开启一个静态服务器

11. Material Icon Theme 文件夹美化

12. Path Intellisense ./ 简写

13. # Prettier Formatter

{
    "semi": false, // 句位添加分好
    "singleQuote": true, // 优先使用单引号
    "trailingComma": "none" // 方法后面添加逗号
}
根目录下就可以
这个时候就可以在代码中选择 ...格式  默认现在这个就可以了

14. Tailwind CSS IntelliSense 配合npm使用vue中不用写css还是很有用的

15. Volar这是vue3代码提示

16. Vetur这是vue2代码提示

基本上这些你用vscode开发前端是够用的，还有一些设置

"editor.tokenColorCustomizations": {
            "variables": "#CD5C5C" // 变量的颜色
        }

小结：

1.如果你要配置一些插件或者设置，一般在setting中可以设置
2.不要装太多的插件
3.有些插件是内置进vscode里面的，这些足够你开发了，如果你想看
svg的图片svg-vies 就可以了

vscode 代码片段，常常有默认代码出现的时候，一直去写一段代码很烦，那么这时候就要用全局代码片段了，局部也还好，个人建议用全局的

管理-配置用户代码片段-创建全局代码片段-vue.json为例 完成后在.vue中创建vue3就可以了

"创建vue3默认模板": {
		"prefix": "vue3",
		"body": [
			"<template>",
			"  <div>$1</div>",
			"</template>\n",

			"<script setup>\n",
			
			"</script>\n",

			"<style lang='scss' scoped>\n",
			
			"</style>"
		],
		"description": "创建vue3默认模板"
	}