1、首先将favicon.ico图片放在根目录下

2、修改webpack配置文件

1)找到build下的webpack.dev.conf.js文件

new HtmlWebpackPlugin({

filename: 'index.html',

template: 'index.html',

inject: true,

favicon: path.resolve('favicon.ico') // 新增 }),

2)找到build下的webpack.prod.conf.js文件

new HtmlWebpackPlugin({

filename: config.build.index,

template: 'index.html',

inject: true,

favicon: path.resolve('favicon.ico'), //新增

minify: { removeComments: true, collapseWhitespace: true, removeAttributeQuotes: true ... }),

修改配置文件后需重启npm run dev 
打包后根目录下就会有favicon.ico

vue中添加favicon.ico的更多相关文章

  1. vue中添加favicon

    基于vue-cli 2 首先将favicon.ico图片放在根目录下,通过以下两种方法使其显示正确. 方法一:修改index.html文件 <link rel="shortcut ic ...

  2. 在vue中添加ico图标

    准备:添加 ico图标在与index.html同级的目录 第一种方法: 在index.html中引入: <link rel="shortcuticon" type=" ...

  3. django 项目中的 favicon.ico 处理

    django 项目中的 favicon.ico 处理  (django == 2.0.6) 1. 引入模块: from django.views.generic.base import Redirec ...

  4. vue中添加util公共方法&&ES6之import、export

    vue中添加util公共方法&&ES6之import.export https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Re ...

  5. 为网站添加favicon.ico图标

    前言 貌似每次都是等到网站快收尾时才做favicon.ico的,这次也不例外.这年代…… 步骤 1.PS制作正方形图标,格式为jpg.jpeg.gif或png. 2.将图标转换为ICO格式,网上有很多 ...

  6. 在ASP.NET CORE中启用favicon.ico

    在静态页面中添加网站标志只需在<head>标签中添加<link rel="shortcut icon" href="favicon.ico" ...

  7. vue中添加title中的小图标

    webpack.prod.conf.js 这个文件中: 引入代码const path = require('path') :下面是进行配置: new HtmlWebpackPlugin({ filen ...

  8. 在vue中添加sass的配置的方法

    1.安装sass的依赖包 npm install --save-dev sass-loader //sass-loader依赖于 node-sass npm install --save-dev no ...

  9. 添加favicon.ico网站文件

    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" me ...

随机推荐

  1. Python数据模型建立

    基本结构AutoField(Field) - int自增列,必须填入参数 primary_key=True BigAutoField(AutoField) - bigint自增列,必须填入参数 pri ...

  2. 对WEB前端的几段思考(一)——界面设计和性能优化(整理中)

    尽管我并非艺术出生,既没有任何设计基础,又没有较高艺术涵养,也深谙在短时间内创造一定艺术造诣并非易事,但是既然当初选择从事网站前端开发,我的目光不能仅停留在前端代码上.作为一名志向在前端领域发展的人员 ...

  3. 【QTP专题】03_Add-in Manager插件

    1.什么是Add-in Manager Add-in Manager,故名思议这是一个QTP插件管理器,每次启动前需要选择对应的插件才能进行测试. 打开QTP之后,我们可以看到有如下的一个Add-in ...

  4. Mac与iPhone的使用

    1.mac操作 苹果Mac操作系统下怎么显示隐藏文件(shift+cmmand+. ) Mac屏幕录制Gif Mac 键盘快捷键 Mac 上安装python3 2.iPhone操作 iPhone如何设 ...

  5. php 调用银联接口 【转载】

    首先要开启openssl开启方法为 openssl证书放在Apache的bin目录中. 其中的php_openssl.dll,ssleay32.dll,libeay32.dll,3个文件拷到windo ...

  6. 【redis基础】

    基础知识 http://www.runoob.com/redis/redis-partitioning.html redis性能分析 https://www.cnblogs.com/mushroom/ ...

  7. jmeter性能测试指标

    1.jp@gc - Actiive Threads Over Time:不同时间的活动用户数量展示(图表) 当前的时间间隔是1毫秒,在setting中可以设置时间间隔以及其他的参数 2.jp@gc - ...

  8. css3 -webkit-filter

    -webkit-filter是css3的一个属性,Webkit率先支持了这几个功能,感觉效果很不错.下面咱们就学习一下filter这个属性吧. 现在规范中支持的效果有: grayscale 灰度   ...

  9. git.exe 妙用

    1.如果 window 上的命令行,在进行编译的不好使 可以尝试在git 中运行 2.运行 python 脚本 ,保持脚本一直执行(尤其是中间出错) 可以做一个 sh 文件,然后在git 中运行 #! ...

  10. springBoot 实现中文国际化

    一:实现效果如下: 二 SpringBoot 国际化配置 1.创建国际化配置文件(3个): messages.properties messages.user.name=用户名 messages.us ...