如上图所示,页面顶部的小图标会让页面显得高大上,一般把这种图标叫做favicon图标。利用vue-cli脚手架搭建的项目,如果不手动配置,页面中是不会显示favicon图标。

不配置是这样子的:

favicon图标的配置也很简单,vue-cli默认帮我们安装了html-webpack-plugin(如果没有,可以自己npm安装),我们只需在html-webpack-plugin插件中添加favicon选项即可。html-webpack-plugin插件需要配置两处,一处是在开发环境下配置,另一处是在打包后的环境下配置,如果只配置开发环境下的,没有配置打包后环境的,造成的结果就是,项目本地运行时会有favicon图标,打包后放在服务器上时发现没有favicon图标;反之亦然。详细配置如下:

1、开发环境(开发调试时)配置:

 

2、生产环境(打包后)配置:

注意:配置favicon图标的路径是相对路径!!!
---------------------

最新文章

  1. TComboBox; 指定某一行,不给下拉,只读ReadOnly 伪装 实现
  2. Java 获取两个日期之间的日期
  3. android studio入门
  4. 【转】Oracle RAC 环境下的连接管理
  5. POJ 1159 - Palindrome (LCS, 滚动数组)
  6. Java & XML Tutorial
  7. nodemon
  8. JavaScript+CSS实现经典的树形导航栏
  9. 迷宫 maze
  10. .Net Service开发(一)
  11. Remote Desktop Organizer – 管理组织远程桌面 - 小众软件
  12. POJ 1184 聪明的打字员
  13. Windows Phone开发(43):推送通知第一集——Toast推送
  14. ebtables
  15. Web.py 框架学习笔记 - ctx
  16. react-native-android之初次相识
  17. jsp学习(2)jsp标签
  18. Python学习过程中各个难点---函数篇
  19. Effective C++ 笔记:条款 31 将编译关系降至最低
  20. AGC 027C.ABland Yard(拓扑/二分图)

热门文章

  1. 六、MyBatis-缓存机制
  2. Spring Aop 动态代理失效分析
  3. MATLAB 和 armadillo 数据转换
  4. linux常用基本命令 grep awk 待优化
  5. [CF846B]Math Show题解
  6. 批量搞机(二):分布式ELK平台、Elasticsearch介绍、Elasticsearch集群安装、ES 插件的安装与使用
  7. Windows无法启动MapGIS DataStorage Service服务
  8. EXP-00091和IMP-00010报错
  9. (最小割)Path
  10. django缓存优化(三)