hello 又回来继续学习了🤭
今天来复习vue基础指令(2)
首先回顾vue基础知识
vue是什么
vue 是一个 渐进式的 javascript 框架 官网地址: cn.vuejs.org/ (作者: 尤雨溪) 渐进式：逐渐增强，vue不强求你一次性在网站中运用学习所有的语法，可以学一点用一点
库和框架的理解
- 库：本质上是一些方法的集合。每次调用方法，实现一个特定的功能。 工具箱
如：moment axios
- 框架：是一套完整的解决方案。框架实现了大部分的功能，我们需要按照框架的规则写代码。
如：vue react angular ... (虽然需要遵循规则，但是带来了高效)
Vue是一个MVVM的框架 （MVVM：一种软件架构模式）
MVVM通过 数据双向绑定 让数据自动地双向同步
M：model数据模型(ajax获取到的数据)
V：view视图（页面）
VM：ViewModel 视图模型 (操作视图+模型)
V（修改视图） -> M（数据自动同步）
M（修改数据） -> V（视图自动同步）
之前的思想，原生 dom驱动。无论修改什么页面内容，先找对象，操作dom。
现在的思想，vue 数据驱动。想更新视图，直接操作数据即可。数据变化，视图自动更新
vue组件化思想
组件化：一个组件会包含（HTML+CSS+JS） ，完整的页面可以拆分成多个组件。
组件化的优点：
-
容易维护
-
便于复用（HTML+CSS+JS）
开发vue有两种方式：
-
传统开发模式：基于html/css/js文件开发 vue
-
工程化开发方式：在webpack环境中开发vue。（推荐，学习+项目）
新开发模式 基于 webpack
vue脚手架：
@vue/cli 也叫 vue脚手架, @vue/cli 是vue官方提供的一个全局命令工具
这个命令可以帮助我们快速的创建一个vue项目的基础架子。 vue脚手架的好处：
-
开箱即用
-
零配置（不用你配webpack）
-
内置babel等工具
vue脚手架的基本使用：
- 全局安装：
npm i @vue/cli -g 或 yarn global add @vue/cli
- 查看vue版本：
vue --version
- 找个目录，初始化一个vue项目：
vue create 项目名（不能用中文）
- cd 进入目录，启动项目, 打包项目：
启动项目：yarn serve 或 npm run serve
打包项目：yarn build 或 npm run build
5 在vue脚手架中如何覆盖默认的webpack配置呢？
修改 vue.config.js 进行配置
脚手架项目里各个文件及代码
目录分析与清理：
-
public/index.html不用动，提供一个最基础的页面
-
src/main.js不用动， 渲染了App.vue组件
-
src/App.vue默认有很多的内容，可以全部删除
-
assets 文件夹 和 components 直接删除
回顾脚手架里主要文件和作用?
-
node_modules –下载的第三方包
-
public/index.html –运行的浏览器网页
-
src/main.js –webpack打包的入口
-
src/App.vue –vue页面入口
-
package.json –依赖包列表文件
