首先你的在你的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. bzoj3751 / P2312 解方程

    P2312 解方程 bzoj3751(数据加强) 暴力的一题 数据范围:$\left | a_{i} \right |<=10^{10000}$.连高精都无法解决. 然鹅面对这种题,有一种常规套 ...

  2. linux第七周

    可执行程序的装载 一.预处理.编译.链接和目标文件的格式 可执行文件的创建——预处理.编译和链接 cd Code vi hello.c gcc -E -o hello.cpp hello.c -m32 ...

  3. 20145315 《Java程序设计》第六周学习总结

    20145315 <Java程序设计>第六周学习总结 教材学习内容总结 第十章:输入输出 10.1.1 数据有来源与目的,衔接两者的是串流对象. read()方法每次尝试读取数据,并返回实 ...

  4. Android项目开发第四周学习总结

    Android项目开发实战第四周 在本周,我们进行了Android项目第四周的项目开发,在本周,我们对原有的项目进行改进,我们的想法是使项目在原有的基础上增加一些新的功能,使得txt阅读器可以更加先进 ...

  5. linux下如何退出tmux和重新进入tmux

    1.退出(detach)当前tmux ctrl+d 2.重新进入tmux tmux attach -t <target-session> 如:当前有很多session,那么选择哪一个呢? ...

  6. js的数组与对象关系

    有的时候总犯糊涂,不理解对象和数组的关系,转载一篇文章,深刻记忆一下 http://hi.baidu.com/samdan/item/05179313d1ee4b9e99ce3371 比如有一个数组a ...

  7. 桌面以及任务栏的所有浏览器,被加上了 hao.360.cn的网址

    桌面以及任务栏的所有浏览器,被加上了hao.360.cn的网址 也不知道是安装了什么软件,中了360的招. 桌面以及任务栏的所有浏览器,被加上了hao.360.cn的网址. 这种东西,肯定是该死的36 ...

  8. js将json格式的list转换为按某个字段分组的map数组

    这几天做的微信公众号项目中,出现了需要将list分组显示的需求,解决方法如下 var data = [{ "id": "32b80b76-a81e-4545-8065-1 ...

  9. codeforce——因数筛

    题目大意:给你一个 n 和 k 求 n 的第 k 个因数. #include<iostream> #include <algorithm> #include <queue ...

  10. vue 子组件传递数据跟父组件

    子组件 <body> <div v-on:click="test"></div> <script> export default { ...