首先你的在你的static文件中添加favicon.icon

然后通过以下方式进行修改

1)方式一:修改index.html文件

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

这个方式可能存在的问题是,在你切换路由的时候,favicon可能又会出错,因此建议使用方式二

2)方法二:修改webpack配置文件

build文件夹下面的 webpack.dev.conf.js,webpack.prod.conf.js,修改他们的 HtmlWebpackPlugin 配置对象

new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true,
favicon: path.resolve(__dirname, '../static/favicon.ico')
}),

重启项目工程

vue项目修改favicon的更多相关文章

  1. java web项目修改favicon.ico图标的方式

    1.修改整个项目的tomcat图标 找到tomcat的根目录(tomcat-webapps-ROOT目录),然后将修改的favicon.ico图标覆盖掉本地的图标,然后再重启项目,刷新,清除浏览器缓存 ...

  2. vue项目中 favicon.ico不能正确显示的问题

    方法一:修改index.html文件 <link rel="shortcut icon" type="image/x-icon" href="f ...

  3. vue项目--favicon设置以及动态修改favicon

    最近写公司项目时,动态更新favicon 动态更新之前需要有一个默认的favicon. 目前vue-cli搭建的vue项目里面已经有了一个static文件夹,存放静态文件. favicon图片放到该文 ...

  4. vue全家桶安装以及修改webpack配置新增vue项目启动方式

    一.安装node环境(自带npm) 下载地址 二.替换下载源 // 淘宝 NPM 镜像 npm install -g cnpm --registry=https://registry.npm.taob ...

  5. 如何做到在webpack打包vue项目后,在外部动态修改配置文件

    在我们做完vue项目后,只需要执行 npm run dist 就可以轻松进行打包转测试,可是如果我们临时需要修改一些配置文件比如域名,这时候我们就有点懵逼了,那就修改了再重新打一次包? NO NO N ...

  6. 百度ueditor vue项目应用 -- 图片上传源码修改

    本文目的有两个,一.废掉单图上传,二.改造多图上传 大家都知道百度ueditor不是针对vue项目开发的,官方文档提供的源码包里有需要后端配置的接口,but到vue项目就不太好办了,网上有些文章也介绍 ...

  7. VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题

    VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题:https://blog.csdn.net/jerrica/article/d ...

  8. vue项目打包,生成dist文件夹,如何修改文件夹的名字

    vue项目打包之后的dist文件目录是如下 如果想要修改dist或则static文件名称,需要打开config / index.js build: { // Template for index.ht ...

  9. Vue项目History模式404问题解决

    本文主要解决Vue项目使用History模式发布到服务器Nginx上刷新页面404问题.(由于每个项目的情况都不尽相同,本方案已经完美解决本在所使用项目,具体情况可能还需要修改.) 1.项目背景分析 ...

随机推荐

  1. 详细了解下PHP的curl函数及常用之处

    CURL 是一个利用URL语法规定来传输文件和数据的工具,支持很多协议,如HTTP.FTP.TELNET等,我们使用它来发送HTTP请求.正因为这么强大,当然PHP也支持 CURL 库,前提是你的ph ...

  2. CSS3:{*zoom:1;}作用

    CSS3:{*zoom:1;}作用 zoom:1的常见作用: zoom是IE专用属性,firefox等是不支持的.它的本来作用是设置或检索对象的缩放比例,但这作用几乎用不到. 可以让网页实现IE7中的 ...

  3. Android实践项目汇报

    Android实践项目:推箱子 推箱子是一款来自日本的古老游戏,其设计目的是训练人的逻辑思维能力.游戏场景一般是设定在空间狭小的仓库中,要求把箱子摆放到指定位置.这就要求玩家巧妙的运用有限的空间和通道 ...

  4. HDU - 3068 最长回文(马拉车Manacher)题解

    思路:马拉车裸题,我们用一个p[i]数组代表以i为中心的最大回文半径.这里用了一个小技巧,如果一个串是aaaa这样的,那我们插入不相干的字符使它成为#a#a#a#a#,这样无论这个串是奇数还是偶数都会 ...

  5. Python学习札记(四十三) IO 3

    参考:操作文件和目录 NOTE: 1.Python内置的os模块可以直接调用操作系统提供的接口函数: 2.os.name 打印操作系统的名称:如果是posix,说明系统是Linux.Unix或Mac ...

  6. java 中 Cannot make a static reference to the non-static 解决方法

    今天敲代码的时候遇到了这个问题,大体这个问题可以简化成这样: public class Test1 { public String get() { return "123"; } ...

  7. Prototype(原型)

    意图: 用原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象. 适用性: 当要实例化的类是在运行时刻指定时,例如,通过动态装载:或者为了避免创建一个与产品类层次平行的工厂类层次时:或者当一个 ...

  8. [翻译]PyMongo官方文档

    PyMongo官方文档翻译 周煦辰 2016-06-30 这是本人翻译的PyMongo官方文档.现在网上分(抄)享(袭)的PyMongo博客文章很多,一方面这些文章本就是抄袭的,谈不上什么格式美观,另 ...

  9. Rails-Treasure chest3 嵌套表单; Ransack(3900✨)用于模糊查询, ranked-model(800🌟)自订列表顺序; PaperTrail(5000✨)跟踪model's data,auditing and versioning.

    自订列表顺序, gem 'ranked-model' 多步骤表单 显示资料验证错误讯息 资料筛选和搜寻, gem 'ransack' (3900✨); 软删除和版本控制 数据汇出(csv), 自订列表 ...

  10. BooStrap4文档摘录 2 Content, Component

    Content Reboot:从新写了主要元素的排列. 本章讲了各种元素及其相关的类. ⚠️ 文档左上角有搜索栏. Components Alert✅ Badge✅ Button✅和Button gr ...