[{"data":1,"prerenderedAt":237},["ShallowReactive",2],{"$fn4yensbuhjtv":3,"content:\u002Fposts\u002F2d9b4f7":44,"surround:\u002Fposts\u002F2d9b4f7":226},{"total":4,"annual":7,"categories":16,"tags":28},{"posts":5,"words":6},12,7234,{"2024":8,"2025":11,"2026":13},{"posts":9,"words":10},5,1227,{"posts":9,"words":12},3158,{"posts":14,"words":15},2,2849,[17,20,23,26],{"name":18,"posts":19},"未分类",1,{"name":21,"posts":22},"笔记",7,{"name":24,"posts":25},"杂谈",3,{"name":27,"posts":19},"生活",[29,30,31,32,33,34,35,36,37,38,39,40,41,42,43],"hexo","软件","壁纸","图床","音乐","刷机","twikoo","npm","cdn","秒传","近期小记","旁路由","软路由","OpenClash","Git",{"id":45,"title":46,"body":47,"categories":204,"date":205,"description":206,"draft":207,"extension":208,"image":209,"meta":210,"navigation":212,"path":213,"permalink":213,"published":214,"readingTime":215,"recommend":25,"references":214,"seo":220,"sitemap":221,"stem":222,"tags":223,"type":224,"updated":205,"__hash__":225},"content\u002Fposts\u002F2025\u002F利用 npm 和公共 CDN 托管文件，加速你的博客访问！.md","利用 npm 和公共 CDN 加速博客静态资源",{"type":48,"value":49,"toc":198},"minimark",[50,54,61,64,68,179,183,186,192],[51,52,53],"p",{},"最近在折腾博客速度优化，发现浏览器控制台里总有几个文件加载得特别慢——尤其是那些体积不小的字体文件😔。于是琢磨着不如把文件丢到 npm 上托管，再用个靠谱的 CDN 镜像加速引入，这不就快起来了？",[51,55,56],{},[57,58],"img",{"alt":59,"src":60},"测速","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de18e3a9f27.webp",[51,62,63],{},"实践下来效果不错，操作也不复杂，记录下步骤供参考：",[65,66,67],"h2",{"id":67},"操作步骤",[69,70,71,91,105,137,155],"ol",{},[72,73,74,75,78,85,87],"li",{},"注册npm账号",[76,77],"br",{},[79,80,84],"a",{"href":81,"rel":82},"https:\u002F\u002Fwww.npmjs.com\u002Fsignup\u002F",[83],"nofollow","npm注册页",[76,86],{},[57,88],{"alt":89,"src":90},"npm 注册页面截图","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de18f5395ad.webp",[72,92,93,94],{},"切换回原生源",[95,96,101],"pre",{"className":97,"code":99,"language":100},[98],"language-text","npm config set registry https:\u002F\u002Fregistry.npmjs.org\n","text",[102,103,99],"code",{"__ignoreMap":104},"",[72,106,107,108,114,116,120,122,123,126,127,130,131,133],{},"在电脑终端里登录npm",[95,109,112],{"className":110,"code":111,"language":100},[98],"# 仅第一次使用需要添加用户，之后会提示你输入你的npm账号密码以及注册邮箱\nnpm adduser\n# 非第一次使用直接登录即可，之后会提示你输入你的npm账号密码以及注册邮箱\nnpm login\n",[102,113,111],{"__ignoreMap":104},[76,115],{},[57,117],{"alt":118,"src":119},"npm 登录提示截图","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de193cd2a7f.webp",[76,121],{},"​      按 ",[102,124,125],{"code":125},"CTRL"," + ",[102,128,129],{"code":129},"单击"," 在浏览器中打开登录页面，登录即可",[76,132],{},[57,134],{"alt":135,"src":136},"浏览器打开 npm 登录验证页面截图","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de198d6c504.webp",[72,138,139,140,146,148,149,151],{},"把你想托管的文件（比如字体、图片）放进一个文件夹，在这个文件夹里打开终端，执行初始化命令：",[95,141,144],{"className":142,"code":143,"language":100},[98],"npm init\n",[102,145,143],{"__ignoreMap":104},[76,147],{},"命令行会问你包名、版本号等信息，一路敲回车用默认值也完全 OK。",[76,150],{},[57,152],{"alt":153,"src":154},"npm init 初始化包信息截图","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de19aa7ad0c.webp",[72,156,157,158,164,166,170,172,173,175],{},"然后输入发布指令，我们就可以把包发布到 npm 上了。",[95,159,162],{"className":160,"code":161,"language":100},[98],"npm publish\n",[102,163,161],{"__ignoreMap":104},[76,165],{},[57,167],{"alt":168,"src":169},"npm publish 发布包成功截图","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de19b1a83d7.webp",[76,171],{},"​            在npm官网中也能看到我们发布的文件",[76,174],{},[57,176],{"alt":177,"src":178},"npm 官网查看已发布文件截图","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de19b99bee5.webp",[180,181,182],"h3",{"id":182},"加速镜像",[51,184,185],{},"文件在 npm 上了，怎么高速引入你的博客呢？试试这些公共 CDN 镜像服务吧！直接把下面链接里的占位符换成你的包信息就行",[95,187,190],{"className":188,"code":189,"language":100},[98],"#JSDMirror 全球cdn 速度快\nhttps:\u002F\u002Fcdn.jsdmirror.com\u002Fnpm\u002Fnpm\u002F:package@:version\u002F:file\n#elemecdn 更新慢，部分包缺少\nhttps:\u002F\u002Fnpm.elemecdn.com\u002F:package@:version\u002F:file\n#Staticfile（七牛云） 同步cdnjs\nhttps:\u002F\u002Fcdn.staticfile.org\u002F${cdnjs_name}\u002F${version}\u002F${min_cdnjs_file}\n",[102,191,189],{"__ignoreMap":104},[51,193,194],{},[57,195],{"alt":196,"src":197},"表情包","https:\u002F\u002Fbu.dusays.com\u002F2025\u002F10\u002F02\u002F68de19c4735ad.webp",{"title":104,"searchDepth":199,"depth":199,"links":200},4,[201],{"id":67,"depth":14,"text":67,"children":202},[203],{"id":182,"depth":25,"text":182},[21],"2025-07-12 21:02:18","将字体、图片等静态文件发布到 npm，再通过公共 CDN 镜像加速引入，完整记录注册、发布与镜像配置的全流程。",false,"md","https:\u002F\u002Fbu.dusays.com\u002F2026\u002F02\u002F10\u002F698b00d103552.webp",{"slots":211},{},true,"\u002Fposts\u002F2d9b4f7",null,{"text":216,"minutes":217,"time":218,"words":219},"3 min read",2.065,123900,413,{"title":46,"description":206},{"loc":213},"posts\u002F2025\u002F利用 npm 和公共 CDN 托管文件，加速你的博客访问！",[36,37],"tech","nN8p3nwXgCGJY8VSBvhIB9cdLRhBGmgJdq0gUbXxU74",[227,232],{"title":228,"path":229,"stem":230,"date":231,"type":224,"children":-1},"网盘秒传的奥秘：利用哈希指纹获取付费资源","\u002Fposts\u002F5a7c1e9","posts\u002F2025\u002F网盘秒传的奥秘，白嫖付费资源","2025-01-30 20:33:51",{"title":233,"path":234,"stem":235,"date":236,"type":224,"children":-1},"N1 盒子刷入 CasaOS，秒变家庭 NAS","\u002Fposts\u002F8c1a5e3","posts\u002F2025\u002FN1盒子刷casaos","2025-10-04 19:28:44",1785905121241]