如何在 npm 包的自述文件中显示 gif？答案

【问题标题】：How to show gif in npm package's readme file?如何在 npm 包的自述文件中显示 gif？
【发布时间】：2020-12-24 19:18:00
【问题描述】：

我在我的自述文件中添加了以下行，它在 GitHub 上运行良好，但 gif 没有显示在 npm 包页面上。

![@bilal111996/react-range-slider horizontal](https://github.com/bilalyaqoob/react-range-slider/blob/master/horizontal.gif)

【问题讨论】：

【解决方案1】：

您需要将 README 中的图片链接替换为“raw”链接（即指向实际图片的链接）。
您使用的链接实际上加载了一个 HTML 页面，其中包含 GIF 的信息作为 GitHub 上的存储库对象。
这会在 NPM 上导致 CORS errors。

你有两个选择：

在网址末尾添加raw=true：
https://github.com/bilalyaqoob/react-range-slider/blob/master/horizontal.gif?raw=true
使用直接的原始 URL：
https://raw.githubusercontent.com/bilalyaqoob/react-range-slider/master/horizontal.gif

注意：要找到此链接：
- 在浏览器中打开 1. 中的链接；它重定向到 2。
- 右击图片并选择“复制图片地址”

【讨论】：