【vue3】使用vscode 创建vue3.0项目，并集成element-plus

1、新建vue3.0项目

//先建终端，依次执行下述命令
npm init vite-app 项目名称
npm install
npm run dev

浏览器打开：http://localhost:3000/

2、新建vue模板

文件-首选项-用户片段，输入vue.json 回车。复制下述代码，然后保存。

{
    "Print to console": {
        "prefix": "vue",
        "body": [
            "<!-- $0 -->",
            "<template>",
            "  <div></div>",
            "</template>",
            "",
            "<script>",
            "export default {",
            "  data () {",
            "    return {",
            "    };",
            "  },",
            "",
            "}",
            "</script>",
            "<style  scoped>",
            "</style>"
        ],
        "description": "Log output to console"
    }
}

在vue文件中，输入vue，点击回车即可新建vue模板。

3、配置路由依赖

终端进入项目：cd+项目名，执行下面指令即完成路由的安装。

npm install vue-router -s

4、安装axios

终端进入项目：cd+项目名，执行下面指令即完成路由的安装。

npm install axios -s

5、安装element-plus

终端进入项目：cd+项目名，执行下面指令即完成路由的安装。vue3使用的elementui名称为element-plus：一个 Vue 3 UI 框架 | Element Plus (gitee.io)

npm install element-plus -s

npm install @element-plus/icons -s

6、补充--换了一台电脑按照上述语句执行不可，所以有下述的解决方法

如果执行第一条语句时报下面的错误： 说明不支持使用该命令进行创建vue项目

 可以按照下面的操作进行：

执行：npm install @vitejs/create-app@latest

执行：npm init @vitejs/app  项目名称  。后续会有一些提示，按照自己的需求选择即可。 

7、其他

安装最新版脚手架vscode执行：npm install -g @vue/cli@next 

卸载脚手架：npm uninstall -g @vue/cli

8、按照插件

后续有内容继续补充。