目录
vue3的设计思想、理念
设计思想
1.Vue3.0 更注重模块上的拆分，在2.0中无法单独使用部分模块，需要引入完整的Vuejs（例如只想使用响应式部分，但是需要引入完整的Vuejs），Vue3中的模块之间耦合度低，模块可以独立使用，拆分模块。
2.Vue2中很多方法挂载到了实例中导致没有使用也会被打包（还有很多组件也是一样）。通过构建工具Tree-shaking机制实现按需引入，减少用户打包后体积。nextTick等等都拆分为了单独的组件。?重写API。
3.Vue3允许自定义渲染器，拓展能力强。不会发生以前的事前，改写Vue源码改造渲染方式。不需要在源码的基础上进行改造了。拓展更方便
依然保留Vue2的特色
声明式架构
Vue3依旧是声明式的框架，用起来简单。
- 早在JQ的时代编写的代码都是命令式的，命令式框架重要特点就是关注过程。
- 声明式框架更加关注结果。命令式的代码封装到了Vuejs中，过程靠Vuejs来实现。
声明式代码更加简单，不需要关注实现，按照要求填代码就可以（给原材料就出结果）
/* 命令式编程 */
let numbers = [1,2,3,4,5];
let total = 0;
for(let i = 0;i<numbers.length;i++){
total += numbers[i] /* 关注了过程 */
}
console.log(total)
/* 声明式 */
let total2 = numbers.reduce(function(memo ,current){
return memo + current
},0)
console.log(total2)采用虚拟ＤＯＭ
传统更新界面，拼接一个完整的字符串innerHTML全部重新渲染，添加虚拟DOM后。可以比较新旧虚拟节点，找到变化再进行更新。虚拟DOM就是一个对象，用来描述真实DOM的
const vnode = {
_v_isVNode: true,
_v_skip: true,
type}区分编译时和运行时
- 我们需要有一个虚拟DOM，调用渲染方式将虚拟DOM渲染成真实DOM（缺点就是虚拟DOM编写麻烦）
- 专门写一个编译时可以将模板编译成虚拟DOM（在构建的时候进行编译性能更高，不需要在运行的时侯进行编译，而且Vue3在编译中做了很多优化）
Vue整体架构
架构介绍
Monorepo管理项目
Monorepo是管理项目代码的一个方式，指在一个项目仓库（repo）中管理多个模块/包（package）。Vue3源码采用monorepo方式进行管理，将模块拆分到package目录中。
- 一个仓库可维护多个模块，不用导出找仓库
- 方便版本管理和依赖管理，模块之间的引用，调用都非常方便
Vue3项目结构
?Vue3采用typescript
Vue2采用flow来进行类型检测（Vue2中对TS支持并不太好），Vue3源码采用typescript来进行重写，对Ts的支持更加友好。
Vue3开发环境搭建
搭建Monorepo环境
Vue3中采用?pnpm workspace 来实现 monorepo（pnpm是快速、节省磁盘空间的包管理器。主要采用符号链接的方式管理模块）
全局安装pnpm
npm install pnpm -g # 全局安装pnpm
pnpm init -y # 初始化配置文件创建 .npmrc文件
shamefully-hoist = true解决pnpm的幽灵依赖问题，羞耻提升
安装所需要的依赖
pnpm install typescript minimist esbuild -w-w表示安装在根目录下。此时文件夹下的每个package都是个单独的包，所以需要加 -w 说明这是每个包都需要的依赖，安装在根目录下。
pnpm tsc --init? // 初始化 typescript
后续配置参考源码中的配置