npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

bilichat

v1.3.3

Published

Downloads

19

Readme

BILICHAT

表面上似乎是个弹幕姬
实际上是youtube chatbox的高仿(指样式表直接照搬)实现,不过把内容换成了b站直播弹幕2333
所以在OBS中对于youtube livechat的自定义CSS代码可以直接copy
自豪地使用好文明Angular 8
感谢logo提供者:@Afanyiyu

交流群 906600901

本地部署版下载

直接使用npm下载

npm install -g bilichat
bilichat

🌟如何在OBS中使用

1

  1. 在场景中新建浏览器源
  2. 在URL处填写 https://bilichat.3shain.com/gkd/<你的直播间ID>
    如果是本地运行的服务,替换上面的域名即可,如 http://localhost:5000/gkd/<你的直播间ID>
    到这一步就已经基本完成了。此时的样式与youtube网页直播间的chatbox完 全 一 致
  3. 设置自定义CSS参数
    你可以从Google上搜索 youtube livechat css 找现成的代码
    也有专门的样式生成器网站 Chat v2 / Chat v2 JP / Chat v2 CN

字体问题

你有可能发现,使用了别人的CSS代码之后,发现中文全是宋体或者只有一部分正常渲染(总之不太好看)。这时候你可以把代码复制到一个编辑器如Notepad++,VSCode,按ctrl+f替换字体的名字。请注意这个字体必须已经安装在推流软件所在的电脑上。不建议使用网络在线字体,可能会出现字体闪烁。

🍥URL参数

在url后面添加query参数可以自定义效果

  • loadAvatar true/false 控制是否从api获取头像 默认true

    这个设置不等于不显示头像,而是只显示默认头像。若需要去掉头像可以在css中设置。

  • levelFilter 一个数字 用户等级(UL)低于该值的弹幕不会被显示 默认0
  • hideGiftDanmaku true/false 控制是否隐藏礼物抽奖弹幕(节奏风暴/摩天楼/小电视的效果) 默认true
  • showGift true/false 控制是否展示礼物信息 默认true

    价值与颜色对应信息如果需要自定义,请参考本地配置文件。

  • wordFilter 以半角逗号分隔的字符串 所有包含关键词的弹幕都会被屏蔽

    有一部分词语已经被默认屏蔽,若需解除请自行修改。

  • giftOnly 只显示礼物信息 默认false
  • groupSimilar 堆叠同类弹幕 默认true
  • pure 是否忽略api服务器 设置为true时只显示默认头像 并且不支持短房间号 默认false
  • blackList 以半角逗号分隔的数字UID字符串,对应用户的弹幕将会被屏蔽
  • minGiftValue 最低显示礼物价值,默认20
  • silverGiftRatio 银瓜子折算金瓜子价值比例,默认0,即不显示任何银瓜子礼物
  • disableAnalytics 关闭数据收集

    数据收集仅包含软件使用记录相关内容,且完全由3Shain个人托管,数据托管者有责任保证任何第三方都无法获取到与用户绑定的数据(包括但不限于用户ID,房间号)

例子: https://your.domain/gkd/114514?loadAvatar=false&levelFilter=20&showGift=false&wordFilter=屏蔽词1,屏蔽词2

🔬 [实验性功能|EXPERIMENTAL] 本地配置文件

参见本地配置文件教程

💲捐助

捐助表示您对我这个项目的认可,所得的钱将用于维护公共服务器,也能激励我继续开发更多好的项目

  • 微信
  • 支付宝