vue组件index.html小图标路径问题

使用vue组件化开发，在index.html里写网页小图标的路径，我的图片都是在src/assets/images下的，写路径./src/assets/images/favicon.ico一直报错，有个办法是丢在static文件夹下写绝对路径本地开发是没有问题了，但是这样总觉得不是很好，如果打包后没有丢在根目录，又报错了。有没有好一点的方案

vue.js vue-cli javascript node.js

阅读 15.2k

5 个回答

得票最新

bamzcu

11516

发布于
2016-12-07

✓ 已被采纳

如果你的网站favicon.ico 不起作用，或者是想要让favicon.ico 的兼容性更好，favicon.ico这个图标一般建议是放在根目录的。放在其他目录，页面加载可能获取不到。
即：http://host/favicon.ico.，而不是http://host/some/favicon.ico.

lyon

15223

发布于
2017-10-26

如果是脚手架新建的话

找到你的配置文件

// build/webpack.dev.conf.js

// 重点在这

new HtmlWebpackPlugin({
    filename: 'index.html',
    template: 'index.html',
    inject: true,
    favicon: './static/favicon.ico'   // 加上这个
})

//index.html 中

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

修改完记得 npm run dev 重启

千泓

30061521

发布于
2016-12-07

自己解决了，这个地方只需要写/static/images/favicon.ico绝对路径就行了，如果不是放在根目录，在路由设置中写root目录层级即可,参考文档https://github.com/vuejs/vue-...

暖心向阳

512

发布于
2016-12-07

新手上路，请多包涵

不会啊。我这样写打包之后路径还是一样的啊。

King

1.5k115166

发布于
2017-06-23

需要在index.html中制定路径

<head>
    <meta charset="utf-8">
    <link rel="shortcut icon" type="image/png" href="/static/favicon.png"/>

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题

vue组件index.html小图标路径问题

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

为什么在谷歌浏览器中 'a' == ['a'] 返回 true？

vue项目如何在初始化之前跳转外部页面？

js如何控制移动端overflow:scroll容器滑动的最大速度？

前端代码更新如何通知用户刷新页面？

vue2.6，打包后app.js，8M,chunk.js，6M，加载打开页面很慢，有什么办法减少，打开页面快一些？

Element Plus表格组件如何呈现复杂布局如图？