Vue2 的 SPA 相关功能和组件:
- vue-loader:让 Webpack 支持 Single File Components 的模块载入器
- Single File Components:在 SPA 中,可以方便得把 HTML, JS, CSS 都写在一个文件里面的一种 Component 机制
- vue-router:Vue 的路由层,不需要重新载入页面就可以加载数据和显示页面
- vuex:Vue 的状态管理器:自己进行简单的状态共享和使用 Vuex 进行共享并没有多大区别,Vuex 最大的优点在于它为你形式化了集中处理数据存储的过程,并提供了所有功能方法去处理那些数据。
vue-loader
vue-loader 的主要功能包括:
- ES2015 enabled by default;
- Allows using other Webpack loaders for each part of a Vue component, for example SASS for <style> and Jade for <template>;
- Allows custom sections in a .vue file that can have custom loader chains applied to them
- Treat static assets referenced in <style> and <template> as module dependencies and handle them with Webpack loaders;
- Can simulate scoped CSS for each component;
- Supports component hot-reloading during development.
Single File Components
由于 SPA 的时候,页面中的元素大部分都是动态载入的,所以模块化是必然的选择,在一个页面中同时撰写 HTML,JS,CSS 也可以让页面逻辑解耦的好选择
vue-router
Vue 的路由系统,SPA 应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来。传统的页面应用,是用一些超链接来实现页面切换和跳转的。在 vue-router 单页面应用中,则是路径之间的切换,也就是组件的切换
vuex
专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化
后面会在实际的使用过程中,继续完善此份文档~