在VUE全家桶项目里面,这里给大家提供了2种方案,进行浏览器图标的配置。
a):先把图片准备好,放在static文件夹下,再找到根目录下的index.html文件,并打开,在HTML文档的<head>标签加入下面代码即可。
<link rel="shortcut icon" href="./static/images/favicon.ico"/>
<link rel="apple-touch-icon" href="./static/images/favicon.ico"/> /*为适应苹果系统配置*/
b):把准备好的图片文件(.ico)放到根目录,修改 build 文件夹下 webpack.prod.conf.js (生产环境)和 webpack.dev.conf.js(开发环境) 文件:
var path = require('path') // 一般vue-cli会自带,当然了,没有的话,再手动引入 // HtmlWebpackPlugin 中添加 favicon new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', favicon: path.resolve('favicon.ico'), // 引入图片地址 inject: true })
最后重新执行npm run dev即可。
**************************************** END ****************************************