前言
这里使用 Vue3 需要升级 vue 的版本至 4.5.0 以上
我的版本，如下
C:\HiSen\myWorkDemo\vue3>vue -V
@vue/cli 4.5.11
C:\HiSen\myWorkDemo\vue3>node -v
v14.17.6
C:\HiSen\myWorkDemo\vue3>
今天分享两种创建工程的方式：webpack or vite
创建工程 webpack
vue create vue3_test
选中第二个， Default (Vue 3 Preview) ([Vue 3] babel, eslint) 回车
这里我使用的是 npm , 你们可以根据自己的包工具选择，回车之后就会安装依赖
接下来就会让你进入工程目录，并启动工程
$ cd vue3_test$ npm run serve
继续前行，启动之后就是这幅光景
来看看启动后的效果，感觉跟 vue2 启动没有什么区别，哈哈哈 ~
创建工程 vite
npm init vite-app vue3_test_vite 这里不要使用 cnpm , 我使用了，结果创建了一个名为 init 的工程
然后按照提示的命令，进入工程目录，初始化
npm install 简写 npm i
最后启动工程
npm run dev
来看看 vite 创建工程的效果吧
看出了点区别，更简洁，更直观，直接告诉你是 vite 创建的 vue3 项目
工程目录结构
创建完了，我们来看一下 vue3 的工程结构有没有什么不一样
整个结构看起来更简洁一些，另外比较重要的是核心入口文件 main.js 有了一些改变，以往是 new Vue 实例，然后通过 $mount 挂载，现在呢，它直接内部封装了 new 的过程，直接暴露出来了一个工厂函数 createApp 让你直接调用，然后 mount 挂载.
好了，初始化的工程其实并不需要我们过多探索，后期的文章才是我们探索的关键， 我会一步步实战 vue3 各知识点
小小鼓励，大大成长，欢迎点赞收藏
