解决Github图片不显示的方法（如果你百度了很多方法都不行，可以来看看）

最新推荐文章于 2025-05-14 03:21:15 发布
最新推荐文章于 2025-05-14 03:21:15 发布
阅读量4.4k 收藏 13
点赞数 5
CC 4.0 BY-SA版权
分类专栏： 问题杂记 文章标签： github
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_36925475/article/details/103860822

最近发现在Github上的图片全都无法显示，包括头像、文档图片等等，按惯例也百度了各种方法还是不行。终于在一个社区帖子里看到了解决方法，抱着尝试的心态试了试居然解决了，于是想分享给大家。

1、尝试过的办法

百度到的方法有很多，比如：换浏览器、重置Internet设置、换wifi、修改代理设置、科学上网等等，都以失败告终。
这篇文章讲的第一种映射IP和域名的方法虽然好用，但是每张裂掉的图片都要在host文件里添一行，比较麻烦不实用。第二种方法就是常见的改host文件的方法，添加了如下内容，结果还是不行。

# GitHub Start 
192.30.253.112    github.com 
192.30.253.119    gist.github.com
151.101.184.133    assets-cdn.github.com
151.101.184.133    raw.githubusercontent.com
151.101.184.133    gist.githubusercontent.com
151.101.184.133    cloud.githubusercontent.com
151.101.184.133    camo.githubusercontent.com
151.101.184.133    avatars0.githubusercontent.com
151.101.184.133    avatars1.githubusercontent.com
151.101.184.133    avatars2.githubusercontent.com
151.101.184.133    avatars3.githubusercontent.com
最低0.47元/天 解锁文章

200万优质内容无限畅学
任务管理器显示不全的解决方案
weixin_43178406的博客
10-28 3万+
 本文主要介绍了windows任务管理器显示不全的解决方案，希望能对使用windows的同学们有所帮助。 文章目录 1. 问题描述 2. 解决方案
学了那么久爬虫，快来看看这些反爬，你能攻破多少？【对应看看自己修炼到了哪个等级~】
热门推荐
孤寒者的博客
09-26 66万+
学了那么久爬虫，快来看看这些反爬，你能攻破多少？【对应看看自己修炼到了哪个等级~】
“github仓库图片文件不显示”的问题（备忘）
qq_43622846的博客
04-11 879
解决“用PicGo + GitHub做博客图床，github仓库图片文件不显示”的问题（备忘） 历时几个小时百度，终于靠自己理解解决了github仓库图片无法显示的问题！！！ 还好我没放弃（感动） 看下图，遇到这种情况不要慌，如果你百度看到我这篇文章，那么恭喜你，你会节省大量百度时间！偷着乐吧，哈哈哈哈 解决方案： 修改host文件，具体操作如下： 如何修改件呢？别急，我教你！很简单！ 修改它！ 针对Windows10系统，打开文件资源管理器，进入这个文件路径：C:\Windows\System32\d
解决github图片不显示的问题
adolhung的博客
11-10 156
修改hosts C:\Windows\System32\drivers\etc\hosts 在文件末尾添加： GitHub Start 192.30.253.112 Build software better, together 192.30.253.119 gist.github.com在这里插入代码片 151.101.184.133 assets-cdn.github.com 151.101.184.133 raw.githubusercontent.com 151.101.18
Typora图片插入终极指南：告别路径错误导致的图片丢失（永久有效方案）
最新发布
codesavant的博客
05-14 1179
A：当然！./images→ 存放在images文件夹../static→ 存放在上级目录的static文件夹→ 按日期创建子目录（注意）绝对路径（如C:\Users\xxx）会导致跨设备失效！相对路径 + 统一仓库 + 自动同步 = 永不丢失现在就去调整你的Typora设置吧！按照这个方法配置后，你可以：✅ 随意移动文档文件✅ 任意切换设备✅ 放心分享给他人再也不用担心辛辛苦苦做的笔记变成"图片失踪案发现场"啦！🎉（彩蛋）如果这篇文章帮到了你，下次写技术文档时试试用![表情包]
(已解决) Github无法显示图像问题
weixin_52836217的博客
06-19 3150
三分钟教你解决github无法正常显示图片的问题，也许问题真的没有你想象的那么难。
github图片不显示
奠基者
10-15 134
https://shimo.im/docs/8gp3CGcQpPYVtdhw/read mac系统 sudo vi /etc/hosts
GitHub图片不显示
fendouweiqian的博客
06-08 320
GitHub Start 151.101.184.133 raw.githubusercontent.com 151.101.184.133 gist.githubusercontent.com 151.101.184.133 cloud.githubusercontent.com 151.101.184.133 camo.githubusercontent.com 151.101.184.133 avatars0.githubusercontent.com 151.101.1
java百度贴吧登陆源码-wsccoder.github.io:博客
06-04
java百度贴吧登陆源码 搭建过程 在搭建博客时候也踩了不少坑，之前写...如果你不知道GitHub，那你就应该先google下GitHub。然后在自己注册下登陆下在Starr Fock 下项目 体验下 拉取博客模版 在GitHub 上搜索下我的博
Github很慢/无法访问：简单两步搞定
99的博客
02-18 1000
获取githubDNS列表，把它们复制到自己本地的hosts文件中！简单顺滑。
github上图片不显示
xccjk的博客
04-20 197
github上图片不显示 运行环境mac pro 命令行输入sudo vi /etc/hosts，需要输入电脑密码 命令行打开hosts文件后，输入i，下面会出现-- INSERT --后就可以输入内容了 将下面内容拷贝到hosts文件最下面 # GitHub Start 192.30.253.112 Build software better, together 192.30.253.119 gist.github.com 151.101.184.133 asse
GitHub图片不显示问题
学无止境
07-13 1207
Windows系统 C:\Windows\System32\drivers\etc\hosts 在hosts文件下添加以下代码即可 # GitHub Start #注释 192.30.253.119 gist.github.com 199.232.28.133 assets-cdn.github.com 199.232.28.133 raw.githubusercontent.com 199.232.28.133 gist.githubusercontent.com 199.23
GitHub图片无法显示
qq_43203949的博客
12-28 2043
GitHub图片无法显示 1.原因 原因是DNS服务无法解析图片的域名 2.解决办法 到C:\Windows\System32\drivers\etc路径下找到hosts文件，添加 注意：请注意ip地址解析的时间有效性 199.232.96.133 raw.githubusercontent.com 199.232.96.133 avatars0.githubusercontent.com 199.232.96.133 avatars1.githubusercontent.com 199.232.96.1
github图片不显示问题
weixin_43832505的博客
10-17 205
在 hosts 文件中添加域名对应的ip # GitHub Start 140.82.113.3 github.com 140.82.114.20 gist.github.com 151.101.184.133 assets-cdn.github.com 151.101.184.133 raw.githubusercontent.com 151.101.184.133 gist.githubusercontent.com 151.101.184.133 cloud.githubusercontent.co
Github图片无法显示，怎么办？
公众号（猴子数据分析）
04-27 710
有小伙伴问，GitHub图片怎么显示不出来，怎么办？今天告诉你解决办法。1.什么是图床？图床，顾名思义是给图片睡觉的床，也就是一个专门放图片的服务器。把需要的图片放到这个服务器上以后，这个...
GitHub无法显示图片问题
蓝家彬的博客
04-01 622
文章目录一、修改方法二、Windows系统三、MacOS系统1. 通过命令行2. 通过图形界面 一、修改方法 到这个网站： https://www.ipaddress.com/ 查下面右边对应的地址 ，就能得到最新的IP地址，最后添加到hosts文件即可。比如搜素raw.githubusercontent.com 得到的是 199.232.28.133那组成填写进hosts文件的就是：199....
github问题----图片不显示(已解决)
mqqgd818的博客
01-26 185
1、打开路径C:\Windows\System32\drivers\etc\hosts 方法：直接在搜索hosts，或者用Everything搜索hosts。(Everything是个文件搜索工具，搜索超快的) 2、打开hosts文件，在最后粘贴以下内容 # GitHub Start #192.30.253.112 github.com #注意着两个必须注释 #192.30.253.119 gist.github.com #必须注释掉，否则gi...
解决github上的图片显示不出来的问题
AI程序媛的博客
07-15 1万+
修改hosts 打开文件： C:\Windows\System32\drivers\etc\hosts 在文件末尾添加： # GitHub Start 192.30.253.112 Build software better, together 192.30.253.119 gist.github.com 151.101.184.133 assets-cdn.github.com 151.101.184.133 raw.githubusercontent.com 151.
github上搭建炫酷的博客网页
03-22
<think>好的，我现在需要帮用户解决在GitHub上创建美观个人博客的问题。首先，用户提到了参考引用中的Hexo和Next主题，所以应该围绕这个展开。 用户可能对静态网站生成器不太熟悉，需要先解释基本流程。GitHub Pages是托管静态网页的好选择，结合Hexo这样的生成器可以方便管理内容。接下来，安装Hexo的步骤需要详细说明，包括Node.js和Git的安装，这可能对新手来说是必要的。 然后，主题推荐部分，除了Next，应该多列几个流行的，比如Butterfly、Hydrogen，甚至Tailwind主题，这样用户有更多选择。每个主题的特点和安装方法要简单说明，避免用户混淆。 教程资源方面，除了官方文档，推荐一些视频和社区资源，比如B站教程和Hexo中文社区，这样用户可以根据喜好选择学习方式。优化建议部分，用户可能希望博客看起来更专业，所以SEO、评论系统和CDN加速这些点都很重要，需要提到相关插件和实现方法。 最后，常见问题解答能帮助用户避免踩坑，比如自定义域名和图片加载问题。要确保回答结构清晰，步骤明确，让用户能一步步跟着操作。同时注意所有数学公式的正确LaTeX格式，但在这个问题里可能用不上，不过还是要检查是否有遗漏的地方。 总结下来，回答应该分步骤讲解搭建过程，推荐主题和资源，提供优化建议，并解答常见问题，确保用户能顺利创建美观的博客网站。</think>### GitHub Pages + Hexo搭建个人博客网站教程 #### 一、基础搭建步骤 1. **环境准备** - 安装Node.js（建议18.x+版本）：`https://nodejs.org` - 安装Git：`https://git-scm.com` - 验证安装： ```bash node -v git --version ``` 2. **Hexo初始化** ```bash npm install -g hexo-cli hexo init hexo-blog cd hexo-blog npm install ``` 3. **GitHub仓库创建** - 新建仓库命名格式：`<用户名>.github.io` - 本地部署配置： ```bash npm install hexo-deployer-git --save ``` 修改`_config.yml`： ```yaml deploy: type: git repo: https://github.com/<用户名>/<用户名>.github.io branch: main ``` #### 二、主题推荐与安装 | 主题名称 | 安装命令 | 特点 | |----------------|--------------------------------------------------------------------------|-------------------------------| | Next | `git clone https://github.com/theme-next/hexo-theme-next themes/next` | 极简风格，支持多语言[^1] | | Butterfly | `npm install hexo-theme-butterfly` | 动态特效，支持PWA | | Hydrogen | `git clone https://github.com/probberechts/hexo-theme-hydrogen themes/hydrogen` | 卡片式布局，暗黑模式 | | Tailwind | `npm install hexo-theme-tailwind` | 响应式设计，模块化组件 | #### 三、详细优化建议 1. **SEO优化** ```bash npm install hexo-generator-sitemap --save npm install hexo-generator-seo-friendly-sitemap --save ``` 在`_config.yml`添加： ```yaml sitemap: path: sitemap.xml ``` 2. **评论系统集成** - Valine（无后端）： ```bash npm install hexo-next-valine --save ``` - Gitalk（GitHub Issues）： ```bash npm install hexo-filter-gitalk --save ``` 3. **图片加速方案** ```markdown ![描述](https://cdn.example.com/image.jpg) ``` 推荐使用jsDelivr免费CDN： ```markdown ![avatar](https://cdn.jsdelivr.net/gh/<用户名>/仓库名@版本号/图片路径) ``` #### 四、进阶配置 1. **自动化部署** 在`.github/workflows/deploy.yml`中添加： ```yaml name: Hexo Deploy on: [push] jobs: build: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v2 - name: Setup Node uses: actions/setup-node@v1 with: node-version: '18' - name: Install Dependencies run: | npm install -g hexo-cli npm install - name: Deploy run: | hexo clean hexo deploy -g ``` 2. **访问统计** - 百度统计： ```yaml baidu_analytics: <你的统计ID> ``` - Google Analytics： ```bash npm install hexo-google-analytics --save ``` #### 五、推荐学习资源 1. **视频教程** - B站《Hexo+GitHub从0到1搭建博客》：[BV号 BV1XJ411n7R4] - YouTube《Hexo Theme Customization》 2. **文档参考** - Hexo官方文档：`https://hexo.io/zh-cn/docs/` - Next主题配置指南：`https://theme-next.js.org/docs/` #### 六、常见问题解答 1. **自定义域名配置** - 在仓库`Settings > Pages > Custom domain`添加域名 - 在博客source目录新建CNAME文件： ``` yourdomain.com ``` 2. **Markdown图片加载失败** - 使用相对路径：`![img](../images/1.jpg)` - 开启post_asset_folder： ```yaml post_asset_folder: true ```
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值