创建Vue3项目（基于create-vue）以及关键文件介绍

只需四步创建Vue3项目

第一步：

前提环境条件：已安装 16.0 或 更高版本的Node.js 。

如有需更改node版本的小伙伴，请先移步这篇文章：使用nvm自由切换node版本_nvm选择版本_爱敲代码的婷婷婷.的博客-CSDN博客在管理多个项目时由于node问题导致项目无法正常启动， 使用nvm版本管理工具：全称是node.js version management,通过它可以安装和切换不同版本的node。下面列出下载、安装及使用方法。_nvm选择版本https://blog.csdn.net/weixin_73318685/article/details/130260750?spm=1001.2014.3001.5502

 第二步：

创建一个vue应用：npm init vue@latest   这一指令将会安装并执行create-vue

第三步：

根据上一步你自定义的项目名称进入文件夹。例如：我这里命名的项目名称为vue3-project，那么我需要先执行 cd vue3-project 命令，然后 npm install 

最后一步：

执行 npm run dev 命令即可启动项目

当页面显示为下方图片这样就说明创建成功啦~

 项目目录和关键文件介绍：

1.  vite.config.js  项目的配置文件 基于vite的配置
2.  package.json  项目包文件 核心依赖项变成了Vue3.x 和vite
3.  main.js  入口文件 createApp函数创建应用实例
4. app.vue  根组件 SFC单文件组件 script - template -style
   1. 变化一：脚本script和模板template顺序调整
   2. 变化二：模板template不再要求唯一根元素
   3. 变化三：脚本script添加setup标识支持组合式API
5. index.html  单页入口 提供id为app的挂载点

下篇文章将为大家介绍vue3与vue2的区别，以便于我们能更直观的了解vue3到来的优势~