# vue3_basic_92
**Repository Path**: monsterchuchu/vue3_basic_92
## Basic Information
- **Project Name**: vue3_basic_92
- **Description**: vue3基础知识点
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 2
- **Created**: 2023-07-31
- **Last Updated**: 2023-07-31
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
## vue2的ui组件库
- element-ui --- pc，web端
- vant-ui - 移动端
- uni-view u-uni 小程序的组件库
- vue3
- element-plus，ant-design-vue --- pc，web端
- vant-ui ---- 移动端
## vue2创建项目
- vue-cli --- 底层是webpack
- vite
## vite 与 webpack 的区别 --- 面试题
- webpack是一个模块打包器，在编译过程中，会将所有模块打包为一个bundle.js文件，然后再运行这个文件，更新速度会随着代码体积增加越来越慢
- vite 是一个基于浏览器原生 ESModule imports 的开发服务器，在开发模式下，没有打包的步骤，它利用了浏览器的ES Module特性，只有在真正需要时才编译文件，所以编译速度快，不受项目体积影响
- 在生产模式下，vite使用Rollup进行打包，提供更好的tree-shaking，代码压缩和性能优化
- **开发效率：** webpack的热更新是全量更新，即使修改一个小文件，也会重新编译整个应用，这在大型应用中可能会导致编译速度变慢； vite的热更新是增量更新，只更新修改的文件，所以即使在大型应用中也能保持极快的编译速度
- **目前企业使用：**webpack有着成熟的插件生态,扩展性非常强。 而vite才刚刚起步，生态不行。 所以webpack适合于大型、复杂的项目。 vite凭更适合于中小型项目开发
## type module含义
1. `type`字段的产生用于定义`package.json`文件和该文件所在目录根目录中`.js`文件和无拓展名文件的处理方式。值为`'moduel'`则当作es模块处理；值为`'commonjs'`则被当作commonJs模块处理
2. 目前node默认的是如果`pacakage.json`没有定义`type`字段，则按照commonJs规范处理
3. node官方建议包的开发者明确指定`package.json`中`type`字段的值
4. 无论`package.json`中的`type`字段为何值，`.mjs`的文件都按照es模块来处理，`.cjs`的文件都按照commonJs模块来处理
**在script标签中写js代码，或者使用src引入js文件时，默认不能使用形式，即不能使用import导入文件，但是我们可以再script标签上加上type=module属性来改变方式**
```javascript
//module.js
export default function test(){
return 'test...'
}
```
```html
// index.html
Document
// 方法 1 ： 引入module.js，然后在script标签里面调用
```
## setup的含义
+ setup就是一个生命周期函数，比beforeCreate还早
+ setup不需要使用this，也不能使用
+ 如果数据或者函数 需要是模板中使用，必须在setup函数里面返回，通过return 对象出去
## watchEffect
## 副作用
一些当状态改变时需要执行的行为，比如在每次msg变量改变时我需要重新打印它，那么这个打印行为就可以说是一个副作用(effect)
- 纯函数中的副作用（side effect）就是如果有一个函数在输入和输出之外还做了其他的事情，那么这个函数额外做的事情就被称为副作用
- react中副作用可以这样理解：组件初始化的时候，组件根据开发者的设定，由自身驱动的第一次DOM修改，就是主作用。主作用之后，组件开始执行用户逻辑，这时你眼里的业务逻辑代码，在React眼里都是副作用
- vue3中的副作用与react中副作用的定义类似，响应式数据的变更造成的其他连锁反应，以及后续逻辑，这些连锁反应都叫副作用。 它可以是获取数据、事件监听或订阅、改变应用状态、修改 DOM、输出日志等等
## ref
+ 定义ref变量，子组件需要通过defineExpose
## 父子组件的生命周期函数执行顺序(创建和销毁)
https://www.cnblogs.com/luhu123/p/16522839.html