样式重置代码

body,p,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,hr,input,td,select,textarea{
margin:0;
padding: 0;
}
body{
font-family: “微软雅黑”;
}
a{
text-decoration:none;
color:black;
}
ul,ol{
list-style: none;
}
img{
border:none;
}
html{
font-size: 26.67vw;
}

项目环境配置
1.安装 node.js
下载地址：https://nodejs.org/en/download/
2.安装淘宝镜像cnpm：npm install -g cnpm
3.安装 vue-cli：npm install vue-cli -g（可以自动的构建项目结构和项目目录）
4.安装webpack：npm install webpack -g
以上安装一次以后均不用安装
5.在合适的位置创建一个文件夹（不要出现中文路径）
6.cd 到指定的路径中 并且初始化文件夹：npm init -y
7.创建项目：vue init webpack 项目名 ！！！这一步很重要
连续按enter直到确认是否搭建路由：
Install vue-router? (Y/n) 按y
接下来的全部按n
然后回车继续安装
8.下好后会有两行黄字提醒：
1）cd到所创建的项目目录下
2）启动项目：npm run dev
出现：your application is running here:http://localhost:8080
就OK了
在浏览器中输入localhost:8080回车就可以看到相关的图标了
如果提示缺少node_modules文件则：npm i 回车即可
至此，空项目搭建完毕
9.删除不必要的东西：
1）用vscode代码编译器打开创建的文件夹，会自动提示下载vetur扩展，点确定下载
若没有提示则自己搜索下载
2)删除components文件夹下helloword.vue中的里的内容，并且修改成自己的
3)把app.vue 中的默认的图片删掉，并把style中的所有样式删掉
10.scoped:当前样式仅对当前组件生效
可以将一些全局使用的样式写在app的style中
创建组件写在components文件夹中 .vue
遇到npm下载出错了可以使用cnpm下载

文件介绍：
build和config是配置目录，在不改变端口号时候和我们写项目没关系
node_modules:插件安装位置
src文件夹
static:静态资源文件：
components:组件
router:路由
app.vue:全局组件，需要删除修里面的一些东西
main:全局配置文件
index.html:展示最终页面的
以.vue结尾的文件：单文件组件，以一个文件封装一个组件

1. 删除 helloword.vue文件里面的   template里面的内容 并且修改成自己的
   

2. 必须要做的   把app.vue中 的那个默认的图片删掉 但是注意千万别把router-view删掉 并且把里面的style样式全部删除掉
   

四、本地图片可以放在assets文件夹这种，最好在里面建一个img文件夹

当出现：A complete log of this run can be found in—
1.将node_modules文件夹删除
2.清理缓存: npm cache clean --force
3.重新安装一次：npm install

二阶段：
npm i --save -dev gulp-babel@7.0.5
.pipe(babel({
presets:[‘es2015’]
}))
安装es2015:npm i babel-preset-es2015 --save-dev

03脚手架使用
1、父子组件
1.先引用：先在父组件页面中引用子组件
import 给你引用的文件起个名字 from “引用地址”
import zi from “./zi” 不加后缀名./为同级
2.后调用：在父组件中与data同级处创建
components:{zi}
3.再使用:在父组件的模板中使用子组件