vscode 基本配置

vue代码块配置
ctrl+shift+P 快捷键打开

输入 snippet 查询配置

然后输入 vue，选择 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": "vue",
		"body": [
			"<!-- $1 -->",
            "<template>",
            "  <div class='$2'>$5</div>",
            "</template>",
            "",
            "<script>",
            "  export default {",
            "    components: {},",
            "      data() {",
            "        return {",
            "",
            "        };",
            "      },",
            "    methods: {",
            "",
            "    },",
            "    created() {",
            "",
            "    },",
            "    mounted() {",
            "",
			"    },",
            "  }",
			"</script>",
			"",
            "<style lang='scss' scoped>",
            "$4",
            "</style>"
		],
		"description": "A vue file template"
	}
}

输入vue就可以自动生成代码片段

html标签自动补全失效配置

{
    "emmet.includeLanguages": {
      "vue-html": "html",
      "vue": "html"
    },
    "emmet.triggerExpansionOnTab": true,
    "editor.quickSuggestions": {
      "other": true,
      "comments": false,
      "strings": true
    },
    "editor.suggestOnTriggerCharacters": true
  }

powershell 运行项目报错

更改执行策略

Set-ExecutionPolicy RemoteSigned -Scope LocalMachine

安装yarn

npm install -g yarn
# 配置镜像源
yarn config set registry https://registry.npmmirror.com
yarn --version

# yarn安装脚手架
yarn global add @vue/cli
# 创建项目
vue create my-project