1. vue和react为什么运行时和编译时
运行时与编译时是前端工程师常常听到的两个词。
比如 Vue 运行时、Angular 运行时、React 运行时……
又比如 svelte 框架，总听到他的宣传说的是“0 运行时”，所以他的工作其实就是在“编译时”了。
这两个词到底是什么意思呢？
2. vue生命周期总共有几个阶段
vue生命周期分为8个阶段，即分别是创建前、创建后、载入前、载入后、更新前、更新后、销毁前、销毁后。VUE是iOS和Android平台上的一款Vlog社区与编辑工具，允许用户通过简单的操作实现Vlog的拍摄、剪辑、细调、和发布，记录与分享生活，还可以在社区直接浏览他人发布的Vlog，与Vloggers互动。随着手机摄像头的发展，越来越多的人开始使用手机拍照和摄像。VUE软件通过点按改变视频的分镜数实现简易的剪辑效果，而剪辑能够让视频传达更多的信息。同时，该软件中有12款滤镜供用户选择，切换至前置摄像头会出现自然的自拍美颜功能。VUE支持40款手绘贴纸，还可以编辑贴纸的出现时间。
3. Vue.js生命周期的详细介绍
总共分为8个阶段，分别为beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroyed、destroyed.
beforeCreate:在实例初始化之后，数据观测者(data observer)和event/watcher事件配置之前调用。
在此阶段无法通过vm访问到data中的数据，methods中的方法。
created:在实例创建完成后立即调用。在这一步，实例已完成以下的配置：数据观测者，属性和方法的运算，watch/event事件回调。然而，挂载阶段还没开始，Sel属性目前不可见。
在此阶段可以通过vm访问到data中的数据，methods中的配置的方法。
beforeMount:在挂载开始之前调用，相关的render函数首次调用。
在此阶段1.页面呈现的是未经Vue编译的DOM结构。2.所以对DOM的操作，最终都不奏效。
mounted: el被新创建的vm.Sel替换，并且在挂载到实例上之后再调用该钩子.如果root实例挂载了一个文档内元素，当调用mounted时vm.el也在文档内。
beforeDestroy：在实例销毁之前调用。在这一步，实例仍然完全可用。
beforeUpdate:在数据更新时调用，发生在虚拟DOM重新渲染和打补丁之前。updated:由于数据更改导致的虚拟DOM重新渲染和打补丁，在这之后会调用该钩子。
在此阶段数据的更新，但是页面是旧的，无法操作新的DOM
updated阶段：页面是新的，一般在这里操作新DOM
destroyed:在Vue.js实例销毁后调用。调用后，Vue.js实例指示的所有东西都会解除绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。
4. vue2项目编译webpack耗时统计
vue编译命令 npm run build ，其实际使用的命令是 vue-cli-service build ，路径是 node_moles\@vue\cli-service\lib\commands\build\index.js
speed-measure-webpack-plugin 每一项耗时都有精确统计，搭配使用 webpack-bundle-analyzer 打包后的各个模块文件大小，直观明了，根据具体项目再去进行优化。
5. 使用create-vue过程中遇到的一些问题
例如没有引入的组件会报错： __If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. __
所以要关注浏览器的警告， 不能忽略，有时候出错了， 编译也不报错，排查很难受
解决方案： 将node版本升级到12及以上； 我用了12.16.2之后，启动成功
笔者误将vue-> Vue了，然后编译器报了个Two output files share the same path but have different contents； 说打包路径不能一直，搞得一脸懵；
最后通过对比发现，Pre-bundling dependencies的结果里面多了个Vue导致的😄；很难受
最后，vite编译的确实很快，不到6秒就能编译成功，风一般的速度； 不过在使用的时候要注意各种坑，希望vite官方，能将错误抛出来，而不是报警告。
感谢vite大佬为我们提供了这么快的编译工具！！！
6. vue编译打包速度优化
1、首先在config文件夹下配置webpack.dll.config.js(内容如下)，要打包的模块的数组可以将一些较大的依赖放进vendor中
2、在package.json的scripts加上
3、运行npm run dll就可以生成vendor-manifest.json和vendor.dll.js
4、然后在index.html中引入vendor.dll.js
然后就可以正常的进行编译打包，会发现将更多的依赖放到vendor，打包速度越快
优化前
优化后
大概平均可以节省三分之一的时间。参考 webpack中文网