vue 学习体系 ​

一、Vue+Webpack的前端工程工作流搭建 ​

1、webpack ​

• webpack机制
• 研究方法
  • webpack原理，各个参数的用法，使用场景，解决哪些问题，带来哪些好处
  • 关键字：webpack分块打包，分模块打包，压缩打包，合并，转义
  • 什么是webpack和grunt和gulp有什么不同？
  • 什么是bundle,什么是chunk，什么是module?
  • 如何可以自动生成webpack配置？
  • 什么 是模块热更新？
  • 什么是长缓存？在webpack中如何做到长缓存优化？
  • 什么是Tree-shaking?CSS可以Tree-shaking吗

2、webpack loade ​

• webpack loader机制
• 研究方法
  • 有哪些loader，如何使用，原理是什么？
  • vue-loader有哪些功能？原理是什么？有哪些参数？怎么用？有哪些配合使用的loader或者plugin，他们之间如何耦合？

3、webpack plugin ​

• webpack plugin机制
• 研究方法
  • 有哪些loader，如何使用，原理是什么？

4、webpack-dev-server ​

• 研究方法
  • webpack-dev-server和http服务器如nginx有什么区别?

二、Vue ​

1、Vue实例 ​

• 研究方向
  • new Vue之后发生了什么
• 研究方法
  • 经过哪些重要过程？对实例产生了什么影响？每一个过程之后对象

2、Vue的生命周期方法 ​

• 研究方向

  • hook机制

• 研究方法

  • 各个hook在哪个阶段触发，为啥会在这个阶段触发？触发这个钩子可以改变什么或者得到什么？

3、原生指令 ​

• 研究方向

  • 指令机制

• 研究方法

  • 有哪些指令，在哪些场景中使用，为啥要定义指令，指令背后如何执行的

4、vDOM ​

• 研究方向

  • vDOM机制

• 研究方法

  • vDOM有哪些属性，有什么优缺点，diff算法

5、组件 ​

• 研究方向

  • 组件机制

• 研究方法

  • 如何定义组件，组件的耦合如何实现、插槽如何粘贴组件，组件之间如何通信，组件如何更新和销毁，动态组件、异步组件

6、render ​

• 研究方向

  • render机制

• 研究方法

  • 条件渲染、列表渲染、update、模板、服务器渲染、渲染性能，如何编译，ast是什么

7、事件 ​

• 研究方向

  • 事件机制

• 研究方法

  • 发射和监听事件的原理，冒泡和广播如何实现，组件直接如何使用事件，事件的设计模式，如何整合dom的事件

8、模式 ​

• 研究方向

  • 观察者模式、通知模式

• 研究方法

  • 如何理解响应式，vue是如何实现双向绑定的、观察者模式、通知模式理论；这样的好处，如何理解mvvm模式，和其他模式有什么差别；

9、Vue-Router ​

• 研究方向

  • router机制

• 研究方法

  • hash，和history api;如何创建一个路由，如何销毁之前的路由，路由解决了哪些问题？Vue-Router在哪个阶段起作用

10、Vuex ​

• 研究方向

  • state prop机制

• 研究方法

  • vuex主要解决什么问题，如果不用vuex如何解决，vuex如何管理state prop;- - - state prop分别来处理什么内容？

11、动画、过渡 ​

• 研究方向

  • 动画、过渡

• 研究方法

  • 如何和指令搭配使用，哪些场景里面使用动画，实现原理是什么？

12、vue的生态 ​

• 研究方向

  • vue的生态

• 研究方法

  • 有哪些组件，或者lib，在什么地方使用到