问答

nuxt项目 favicon.ico不显示

作者:admin 2021-07-01 我要评论

问题描述 如下设置,但是在浏览器地址栏不显示图标 如何设置才能显示出来 问题出现的环境背景及自己尝试过哪些方法 相关代码 link: [{ rel: 'icon', type: 'imag...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

问题描述

如下设置,但是在浏览器地址栏不显示图标
如何设置才能显示出来

问题出现的环境背景及自己尝试过哪些方法

相关代码

link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]

###

1.首先在nuxt.config.js中配置:

link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],

2.你的favicon.ico图标文件需要放到static目录下,结构如下图:
image.png
因此你可以检查一下你文件放的目录是否正确。

###

我手动把 favicon放在了项目根目录后,解决了我的问题,在nuxt项目的 server/index.js 文件里添加下面的代码,sent方法用了koa-send库;

app.use(async (ctx, next) => {
    let pattern = /\.[\d\w]+$/;
    let fileName = pattern.test(ctx.path) 
    ? ctx.path 
    : ctx.path+'index.html';
    
    if(ctx.url.indexOf('/dist/') > -1){
        await send(
            ctx, 
            fileName, 
            {root: path.join(__dirname, '../')}
        )
    } else if(ctx.url.indexOf("favicon.ico") > -1) {
        await send(ctx, fileName, {root: path.join(__dirname, '../')})
    } else {
        next();
    }
  })
###

我信你个鬼
nuxt我下载后更笨没动nuxt自己都配置好了但是就是出不来

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • nuxt项目 favicon.ico不显示

    nuxt项目 favicon.ico不显示

  • 如何正则匹配:连续的字符不重复?

    如何正则匹配:连续的字符不重复?

  • 为什么React 点击一次按钮,render执行

    为什么React 点击一次按钮,render执行

  • vue中嵌入3d模型。请问怎么点击下拉框

    vue中嵌入3d模型。请问怎么点击下拉框

腾讯云代理商
海外云服务器