Vue系列—初识Vue

一、历史背景

VUE的历史背景跟VUE一样简单纯粹,开始它只是个人(尤雨溪)在2013年的一个兴趣项目,现在生态圈已经逐渐的完善,受到国内一致好评。

二、是什么

是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动

三、要解决的问题

要解决的是数据驱动的问题,避免手动操作DOM。

四、特点

1、更加轻量 20kb min+gzip(开启gzip压缩后只有20kb);
2、渐进式框架(不需要学习完VUE的所有知识,即可将VUE用于项目中,逐步学习);
3、响应式的更新机制;
4、学习成本低。

五、版本记录

  • Vue 3.x
  • Vue 2.x
  • Vue 1.0
  • Vue 0.12
  • Vue 0.11

六、与Angular对比

1.TypeScript

Angular 事实上必须用 TypeScript 来开发,因为它的文档和学习资源几乎全部是面向 TS 的。TS 有很多好处——静态类型检查在大规模的应用中非常有用。
然而,并不是所有人都想用 TS——在中小型规模的项目中,引入 TS 可能并不会带来太多明显的优势。在这些情况下,用 Vue 会是更好的选择。

2.体积

在体积方面,最近的 Angular 版本中在使用了 AOT 和 tree-shaking 技术后使得最终的代码体积减小了许多。但即使如此,一个包含了 Vuex + Vue Router 的 Vue 项目 (gzip 之后 30kB) 相比使用了这些优化的 angular-cli 生成的默认项目尺寸 (~65KB) 还是要小得多。

3.学习曲线

要学习 Vue,你只需要有良好的 HTML 和 JavaScript 基础。有了这些基本的技能,你就可以非常快速地通过阅读指南投入开发。
Angular 的学习曲线是非常陡峭的——作为一个框架,它的 API 面积比起 Vue 要大得多,你也因此需要理解更多的概念才能开始有效率地工作。当然,Angular 本身的复杂度是因为它的设计目标就是只针对大型的复杂应用;但不可否认的是,这也使得它对于经验不甚丰富的开发者相当的不友好。

七、目录结构

目录/文件 说明
build 项目构建(webpack)相关代码
config 配置目录,包括端口号等。我们初学可以使用默认的
node_modules npm 加载的项目依赖模块
src 包含了几个目录及文件
static 静态资源目录,如图片、字体等。
test 初始测试目录,可删除
.xxxx文件 这些是一些配置文件,包括语法配置,git配置等
index.html 首页入口文件,你可以添加一些 meta 信息或统计代码啥的
package.json 项目配置文件
README.md 项目的说明文档,markdown 格式
上一篇:angular懒加载的问题


下一篇:angular 修仙之路