跟着视频里的老师做东西，一些不知道的知识的总结以及因为版本的问题出现的一些问题的解决。
vue的介绍和安装
组件设计原则
- 页面上每个独立的可视/可交互区域视为一个组件
- 每个组件对应一个工程目录，组件所需要的各种资源在这个目录下就近维护。
- 页面不过是组件容器，组件可以嵌套自由组合形成完整的页面。
单元测试
e2e测试
- http://blog.csdn.net/panda_m/article/details/66973598?utm_source=itdadao&utm_medium=referral
- e2e或者端到端（end-to-end）或者UI测试是一种测试方法，它用来测试一个应用从头到尾的流程是否和设计时候所想的一样。简而言之，它从一个用户的角度出发，认为整个系统都是一个黑箱，只有UI会暴露给用户。
项目文件介绍
- build,webpack配置相关
- node_modules,通过node安装的项目依赖
- src，源码
- static，存放第三方静态资源，.gitkeep的用处是当该目录为空时，也可以将该代码提交到git仓库中。因为git会自动忽略空目录
- babelsrc,babel的配置文件，presets转码规则，stage-2表示草案(ES7不同阶段语法提案的转码规则（共有4个阶段），选装一个)
- editencoding,编辑器的配置
- eslintignore，忽略语法检查的目录文件
- eslintsrc，eslint配置文件，rules用来自己定义部分规则
- gitingore，提交到git时忽略到文件
- postcssrc，postcss预处理器，而这是它的配置文件
资源处理
icomoon
icomoon在线制作图标字体文件。可以随意选择已经存在的或者上传自己的图标生成字体文件。down下来的字体格式有多种，另外，配有demo及使用说明。
—为什么要使用？
图片增加了总文件的大小和额外的”http请求”，会大大降低网页的性能。并且不能很好的进行“缩放”，因此，有时候在“响应式设计”中需要使用图像的最好解决方案就是不去使用图片。
- 很容易任意地缩放；
- 很容易地改变颜色；
- 很容易地产生阴影；
- 可以拥有透明效果；
- 一般来说，有先进的浏览器支持；
- 可以使用CSS来装饰（可以得到CSS很好支持）；
- 可以快速转化形态（做出一些变化，如 :hover等）；
- 可以做出跟图片一样可以做的事情（改变透明度、旋转度，等）；
- 本身体积更小，但携带的信息并没有削减。
jsonview
链接:https://pan.baidu.com/s/1OeWq9aDDxZDg2_9RqDQa6Q 密码:zy71
可以将json数据格式化显示。更多工具–扩展程序，直接拖入即可。
mock数据
新版dev-client与dev-server不见的问题。
参考网址:https://www.xiuyuan.info/?p=230#comment-194
样式重置
cssreset里面有很多种css样式重置的代码，可以选择其中一种，但是要注册，另外，我自己这边访问的时候挺慢的。其实网上也有很多将官网代码展示出来的，so我们就可以不用费事去注册了。比如这个，这个
eslint
- semi,多余的分号错误
- indent，缩进错误
- no-multiple-empty-lines,空行太多，最多只允许有一行。
- key-spacing,意思就是说属性的键后面跟的值要在紧挨着属性的冒号后再空一个格。
- / eslint-disable no-new /在js里面，new 一个对象，需要赋值给某个值（变量），用Vue实例化的时候，不需要赋值给值（变量），所以要单独给配一条规则，给new Vue这行代码上面加这个注释，把这行代码规则的校验跳过，通过eslint-disable。eslint的常用技巧之一。如果我们去掉这个注释的话，会报这样的错误。
message: 'Do not use 'new' for side effects. (no-new)'vue模板设置
参考网址:https://www.cnblogs.com/fayin/p/7910518.html
mac下的话是code——首选项——用户代码片段——输入vue，会有vue.json与vue-html.json，这两个文件的话，要在vue.json里面进行设置。设置成功后，输入vue，enter即可。postcss
官方网站: http://postcss.org
在安装vue的时候就已经将其安装好。它可以自动帮我们处理一些css兼容性的问题。错误
- Do not use built-in or reserved HTML elements as id:header 意思是说vue的组件命名不能与html5重复。另外那些不合法的、vue保留的也不能用作组件名。
- 错误如下:问题是我们使用less作为css预处理器，并将style的lang设置为less。但是此时没有加载node模块中的less-loader，因此，编译器不能识别less的语言。问题中讲的很清楚，npm install less-loader –save即可。
1
2
3
4
5
6
7
8
9
10This dependency was not found:
* !!vue-style-loader!css-loader?{"sourceMap":true}!../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v
-7ba5bd90","scoped":false,"hasInlineConfig":false}!less-loader?{"sourceMap":true}!../node_modules/vue-loader/lib/selector?type=
styles&index=0!./App.vue in ./src/App.vue
To install it, you can run: npm install --save !!vue-style-loader!css-loader?{"sourceMap":true}!../node_modules/vue-loader/lib/
style-compiler/index?{"vue":true,"id":"data-v-7ba5bd90","scoped":false,"hasInlineConfig":false}!less-loader?{"sourceMap":true}!
../node_modules/vue-loader/lib/selector?type=styles&index=0!./App.vue
+