Bing - 每日壁纸
452 字
2 分钟
利用NPM和CDN加速静态文件
最近在折腾博客速度优化,发现浏览器控制台里总有几个文件加载得特别慢——尤其是那些体积不小的字体文件😔。想起来之前看过安知鱼大佬关于 npm 图床的文章,思路很赞。于是琢磨着不如把文件丢到 npm 上托管,再用个靠谱的 CDN 镜像加速引入,这不就快起来了?
实践下来效果不错,操作也不复杂,记录下步骤供参考:
操作步骤
-
注册npm账号
-
切换回原生源
npm config set registry https://registry.npmjs.org -
在电脑终端里登录npm
# 仅第一次使用需要添加用户,之后会提示你输入你的npm账号密码以及注册邮箱npm adduser# 非第一次使用直接登录即可,之后会提示你输入你的npm账号密码以及注册邮箱npm login
按
CTRL+单击在浏览器中打开登录页面,登录即可
-
把你想托管的文件(比如字体、图片)放进一个文件夹,在这个文件夹里打开终端,执行初始化命令:
npm init命令行会问你包名、版本号等信息,一路敲回车用默认值也完全 OK。

-
然后输入发布指令,我们就可以把包发布到 npm 上了。
npm publish
在npm官网中也能看到我们发布的文件

加速镜像
文件在 npm 上了,怎么高速引入你的博客呢?试试这些公共 CDN 镜像服务吧!直接把下面链接里的占位符换成你的包信息就行:
#JSDMirror 全球cdn 速度快https://cdn.jsdmirror.com/npm/npm/:package@:version/:file#elemecdn 更新慢,部分包缺少https://npm.elemecdn.com/:package@:version/:file#Staticfile(七牛云) 同步cdnjshttps://cdn.staticfile.org/${cdnjs_name}/${version}/${min_cdnjs_file}
支持与分享
如果这篇文章对你有帮助,欢迎分享给更多人或赞助支持!
最后更新于 2025-07-12,距今已过 213 天
部分内容可能已过时
喜之梁