如何从图像URl Gatsby中删除哈希 [英] How to remove hash from Image URl Gatsby

问题描述

好吧，我已经建立了自己的Gatsby网站，并且遇到了Image问题.它会在图像文件名的末尾生成一个哈希.

Well, I have build my Gatsby website and facing a problem with Image. It's generating a hash at the end of image file name.

/static/imagename-719331c87d42041b22e62a63d9af6e69.webp

/static/imagename-719331c87d42041b22e62a63d9af6e69.webp

代码:

    import Img1 from '../images/image.webp';
   .........
......
...........
     <picture>
           <source srcSet={Img1} />
           <img src={Img1} alt="alt" loading="lazy" height="500px" width="800px"/>
     </picture>

我如何克服这个问题.

第二件事是:我没有将我的公用文件夹部署到netlify.是否有必要将公用文件夹推送到github?这样netlify会得到吗?每次我将网站推送到github并netlify重新上传所有文件时.

Second thing is: i am not deploying my public folder to netlify. Is it necessary to push the public folder to github? so netlify will get it? Each time i push my site to github and netlify reupload the all files.

推荐答案

我如何克服这个问题.

How I can overcome the problem.

如果图像的重量小于10,000字节，则Gatsby将返回数据URI而不是路径.根据静态文件夹的文档:

If your image's weight is less than 10,000 bytes, Gatsby will return a Data URI instead of the path. According to the documentation of the static folder:

要减少对服务器的请求数量，请导入用于如果少于10,000个字节，则返回数据URI而不是路径.这适用于以下文件扩展名: svg ， jpg ， jpeg ，png， gif ， mp4 ， webm ， wav ， mp3 ， m4a ， aac 和 oga .

To reduce the number of requests to the server, importing images that are less than 10,000 bytes returns a data URI instead of a path. This applies to the following file extensions: svg, jpg, jpeg, png, gif, mp4, webm, wav, mp3, m4a, aac, and oga.

尝试将其更改为另一种格式.

Try changing it to another format.

第二件事是:我没有将我的公用文件夹部署到Netlify.是否有必要将公用文件夹推送到Github?所以Netlify会得到它?每次我将网站推送到GitHub和Netlify时，都会重新上传所有文件.

The second thing is: I am not deploying my public folder to Netlify. Is it necessary to push the public folder to Github? so Netlify will get it? Each time I push my site to GitHub and Netlify reupload the all files.

当然不是.您不应发布您的/public 文件夹，因为该文件夹将由Netlify(或您的部署系统)在每个构建/部署中创建.这将浪费MB.

Of course not. You should not publish your /public folder since it will be created by Netlify (or your deploy system) in each build/deploy. It would be a waste of MB.

这篇关于如何从图像URl Gatsby中删除哈希的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！