1. iconfont的使用
在iconfont官网选好自己项目中使用的svg图标,将这些图标添加到指定项目中,然后点击下载到本地,解压后,可用的文件是:iconfont.css和iconfont.eot、svg、ttf、woff这四种字体,将iconfont.css文件和其他的第三方css文件放在一起,将四种字体文件放在一个名为iconfont的文件夹中,这样做就是归个类而已。
需要注意的是:四个字体被iconfont.css文件引入,而iconfont.css被main.js入口文件引入,这样组件都可以使用iconfont.css了。
四个字体被iconfont.css文件引入是url路径:
iconfont.css被main.js入口文件引入:
在组件中的使用:任意标签 + class=iconfont + 转义字符
<span class="iconfont"></span>
注意:要确保iconfont.css文件完整,不要随意删除里面的代码。
还有其他的使用方式:待完善
2. 路径别名
在build文件夹下,有webpack.base.conf.js文件中,resolve对象,可以设置路径别名,在全局中生效
3. css变量
在组件样式style标签中引入定义变量的文件,注意在style中引入文件时,import前加@,路径前加~
@import '~styles/varible.styl'
变量的定义:$变量名 = css属性值
$bg = #00bcd4
4. 补充知识点:
(1)display:flex,flex-grow的使用
(2)git知识:
创建一个分支:git checkout -b 分支名,
将本地仓库的代码提交到分支:git push origin 分支名
(3)vue超链接:router-link标签取代a标签,to属性取代ref属性
(4)yarn命令:yarn run dev 开启开发模式的服务器;yarn add 插件名 添加插件