1.下载脚手架 npm install vue-cli -g 输入vue-cli安装命令:
2.vue init webpack AwesomePos 采用的是webpack模板,输入初始化命令
3.
挑选自己喜欢的图标
Iconfont中有很多图标,我们可以像在超市逛街一样,挑选自己喜欢的商品,然后放入购物车。
挑选图标的过程(共6步)
- 进入网站:Iconfont网址:http://www.iconfont.cn
- 点击网站上方的“官方图标库”,选择自己喜欢的图标。在这里我选择天猫的图标库。
- 选择好自己喜欢的图标,你可以有两个选择,下载代码 和 添加至项目。
- 我们这两选择添加至项目,然后新建项目,并输入名称。
- 项目添加好后,会自动给我们转入到我们项目库中。点击查看在线链接。
- 生产css引入的代码,生成后就可以在项目首页index.html引入了。
- 图标使用:<i class="icon iconfont icon-hanbao"></i>最后的class是决定图标的前两个是固定
4.开始写组件写完之后放在app.vue中 这个是页面的入口那文件
- |-- App.vue // 页面入口文件
- | |-- main.js // 程序入口文件,加载各种公共组件
- index.html // 入口页面