title: Vue CLI Favicon
body: <p>I am using the Vue CLI webpack template, but struggling to load my own favicon.</p>
  
  <p>I have run <code>vue init webpack my-app</code></p>
  
  <p>In <code>index.html</code> I have included:</p>
  
  <pre><code>&lt;link rel="shortcut icon" href="&lt;%= webpackConfig.output.publicPath %&gt;favicon.ico"&gt;
  </code></pre>
  
  <p>... and I DO see the default (Vue) favicon.  However, I cannot work out where that favicon is located (or otherwise referenced), nor can I figure out where to place my own favicon, to replace it.</p>
  
  <p>I have also followed the advice in <a href="https://stackoverflow.com/a/40191627/2581585">this answer</a>, which suggests placing the favicon image in the <code>static</code> folder and including this in <code>index.html</code>:</p>
  
  <pre><code>&lt;link rel="shortcut icon" type="image/png" href="/static/favicon.png"/&gt;
  </code></pre>
  
  <p>However, I do not have access to my favicon, as promised.</p>
  
  <p>My guess is that the favicon location / file is referenced somewhere in the CLI config files, but I cannot find it.</p>