写在前面
视频链接:
3h速成vue3.X
-
如何学习本视频?(学习方法介绍)
-
这个视频讲了什么?(核心知识点+课程内容介绍)
vue2.x框架常用知识点(模版语法、条件渲染、列表渲染等)
∨ue2x核心技术(vue- router、vuex)
集成∨ue2x
适合什么人群?
前端小白(有基础的HTML/CSS/ javascript知识)
想学习最流行的前端框架vue,提高生产效率
想扩展前端知识,快速入手ue2x
重点?
vue2x框架常用知识点——20%
- 认识vue: Hello yue应用
- 模块语法,-bind属性绑定,事件绑定
- 条件渲染、列表渲染、Cass与 Style绑定
vue2x核心技术——30%
- 认识vue-c工具vue代码规范
- vue组件的调试方法
- vue-router(状态路由) vuex(状态管理)
集成Wue2.x——30%
- 介绍 workflow工作流(单页面和多页面开发方式)
- 单页面Demo(动态表单、列表动态展示)
- 使用Cli工具,开发常见的应用组件(动态列表渲染)
特点:
小而美(灵活的语法、灵活的开发方式)
丰富的生态(模块、插件、开发团队、开发资料)
广泛的应用(移动端、PC端)
配置环境并测试:
参考链接:windows环境搭建Vue开发环境
安装好之后,在命令行查看版本,验证安装:
node --version
vue --version
在这个教程中,创建新的项目,需要分情况
vue init webpack mytest
vue init webpack-simple mytest
使用webpack-simple与webpack创建项目,最大的区别是没有vue-router的中间件,不需要路由时推荐使用;
各个名词之间的关系
- node是一个在浏览器外执行JavaScript语言的环境,就好比JRE是Java的运行环境。
- Vue是尤大写的MVVM前端框架,使用Vue-cli可以快速搭建一个在运行在node上的Vue项目。
- Element UI就是饿了么团队写的一个前端组建库,可以跟Vue配合使用,类似于jQuery使用jQWidgets。
- nvm是node version manager,做node版本的管理,node切换版本号的需求越来越迫切,传统卸载一个版本在安装另一个版本的方式太过于麻烦,有nvm比较方便管理nodejs更新。