视频资源来自：b站coderwhy王红元老师——最全最新Vue、Vuejs教程，从入门到精通
文章仅为个人观看视频后的学习心得笔记，用于个人查看和记录保存。文中定有疏漏错误之处，恳请指正。
Vue CLI详解
Vue CLI
Command-Line Interface
Vue CLI使用前提 ：Node、webpack、npm
安装：npm install -g @vue/cli
安装CLI2：npm install @vue/cli-init -g
Vue CLI2初始化项目：vue init webpack my-project
Vue CLI3初始化项目：vue create my-project
Vue CLI2
VueCore+vue-router+vuex
ES(js)-Lint——对js代码进行限制，之后都必须写规范。不能有任何错误（多个逗号、分号、函数和括号少空格了、定义了函数没有用），否则会报错。
可以在config文件夹里的修改useEslint为false
ctrl + S保存程序
e2e——end to end端到端测试->selenium
js ->字节码 ->浏览器
V8引擎：js ->二进制代码
static静态资源文件夹，编译后会原封不动地放到dist文件夹
CLI2生成的目录结构解析
Runtime-Compiler和Runtime-only的区别
箭头函数：
render: h => h(App)
等价于
render: function (h) {
return h(App)
}
Vue程序运行过程：
template - >ast ->render ->virtual dom ->真实dom
==runtime-complier：==
template - >ast ->render ->virtual dom ->UI
==runtime-only：==
render ->virtual dom ->UI
流程少，性能更高，代码量更少（轻6kB）
1.createElement('标签',{标签的属性},['标签里的内容'])
new Vue({
el: '#app',
render: function (createElement) {
return createElement('h2',
{class:'box'},
['Hello World',createElement('button',['按钮'])])
}
})
2.传入组件对象：这样就不用写template了
new Vue({
el: '#app',
render: function (createElement) {
return createElement(cpn)
},
components: {
cpn
}
})
相似于runtime-only
那么，.vue文件中的template是由谁处理的呢？
loader-template-complier
App对象：没有template，只有render
Vue CLI3
vue2.5.21 ->vue2.x ->flow-type(facebook)
Vue3.x ->TypeScript(microsoft)
设计原则：“0”配置
vue ui 可视化
preset：配置
manually：手动的
按空格是选择/取消
配置：
Users/YY/全局配置文件.vuerc保存了个人配置
vcs -> version control system 版本控制错误
之前的dev变成serve了。"serve": "vue-cli-service serve",
el也不用写
配置：
1.在终端/cmd：vue ui
导入文件夹后，可以显示项目仪表盘
2.项目中创建文件：vue.config.js 必须这个名
使用git添加进去：git add .，git commit -m '修改配置文件'
总目录：
总目录：
邂逅Vuejs
Vue基础语法
组件化开发
前端模块化
webpack详解
Vue CLI详解
vue-router
Promise的使用
Vuex详解
网络模块封装
项目实战