uniapp添加网站图标favicon文件

x33g5p2x  于2021-08-23 转载在 Java  
字(1.3k)|赞(0)|评价(0)|浏览(699)

添加网站图标

uni-app 官网目前已经支持配置首页的标题,描述,关键字,和引入外部文件;
在下面的模板中可以自定义引入meta标签;
详细配置可以看官方文档:
https://uniapp.dcloud.io/collocation/manifest?id=h5-template
给出在工程根目录下新建template.html, 引入下面的模板;

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>
            <%= htmlWebpackPlugin.options.title %>
        </title>
        <script>
            var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
        </script>
        <link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
		
    </head>
    <body>
        <noscript>
            <strong>Please enable JavaScript to continue.</strong>
        </noscript>
        <div id="app"></div>
        <!-- built files will be auto injected -->
    </body>
</html>

在static 文件夹下 引入 favicon.ico , 在 head 中添加如下链接引入 ico 图标

<link rel="icon" href="<%= BASE_URL %>static/favicon.ico">

在 mainfest.json中配置,关联模板路径

重新运行就可以在网站源码中看见 ico图标

相关文章

微信公众号

最新文章

更多