Vue index.html favicon issue

僤鯓⒐⒋嵵緔 提交于 2019-12-07 07:00:32

问题


I am using Vue 2.0 and Vue CLI 3.0. I am trying to get the favicon.ico/png file work properly and am having no luck at all.

I have narrowed the issue to the following.

The index.html file generated by yarn build converts this line of html code:

<link rel="icon" href="favicon.png" >

to...

<!--[if IE]><link rel="icon" href="favicon.png"><![endif]-->

If I go into Chrome developer tools and change the line back to the way I had it originally, the ico/png file renders as expected.

My question is: how do I fix this so that yarn build stops messing up my html code.


回答1:


Inside the vue.config.js set the PWA options for the icons to point to whatever icons you want. Specifically, set pwa.iconPaths for example:

module.exports = {
  pwa: {
    iconPaths: {
       favicon32: 'img/icons/myFavicon.png',
    }
  }
}

See

  • https://cli.vuejs.org/config/#pwa
  • https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa


来源:https://stackoverflow.com/questions/52684709/vue-index-html-favicon-issue

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!