因为 app.d.ts 里有个 export enum GuardLevel，现在会编译到 index.d.ts 里变成 enum GuardLevel，然后引入这个包后就会报错：

// file: index.ts
import { startListen, MsgHandler } from 'blive-message-listener'
// ... codes ...

$ tsc
node_modules/blive-message-listener/dist/index.d.ts:41:1 - error TS1046: Top-level declarations in .d.ts files must start with either a 'declare' or 'export' modifier.

编译的时候 d.ts 和 ts 的处理是不同的，其实按你这个项目的用途来看，app 不应该是 d.ts，而是一个正常的 ts 文件，因为按照官方的解释 https://github.com/Microsoft/TypeScript/issues/5112#issuecomment-145633791 ，d.ts 文件应该是构建系统的输入，不应该参与到输出，而你 app 文件里全是用于输出的，所以应该是 ts 文件，那样就可以编译成正常的 declare enum GuardLevel。

安装方式

pnpm i blive-message-listener

pnpm dev 报错：

X [ERROR] No matching export in "browser-external:node:net" for import "connect"

    node_modules/.pnpm/[email protected]/node_modules/tiny-bilibili-ws/dist/index.mjs:1:9:
      1 │ import { connect } from 'node:net';
        ╵          ~~~~~~~

X [ERROR] No matching export in "browser-external:node:zlib" for import "brotliDecompress"

    node_modules/.pnpm/[email protected]/node_modules/tiny-bilibili-ws/dist/index.mjs:5:9:
      5 │ import { brotliDecompress as brotliDecompress$1, inflate as inflate$1 } from 'node:zlib';
        ╵          ~~~~~~~~~~~~~~~~

X [ERROR] No matching export in "browser-external:node:zlib" for import "inflate"

    node_modules/.pnpm/[email protected]/node_modules/tiny-bilibili-ws/dist/index.mjs:5:49:
      5 │ import { brotliDecompress as brotliDecompress$1, inflate as inflate$1 } from 'node:zlib';
        ╵                                                  ~~~~~~~

22:54:27 [vite] error while updating dependencies:
Error: Build failed with 3 errors:
node_modules/.pnpm/[email protected]/node_modules/tiny-bilibili-ws/dist/index.mjs:1:9: ERROR: No matching export in "browser-external:node:net" for import "connect"
node_modules/.pnpm/[email protected]/node_modules/tiny-bilibili-ws/dist/index.mjs:5:9: ERROR: No matching export in "browser-external:node:zlib" for import "brotliDecompress"
node_modules/.pnpm/[email protected]/node_modules/tiny-bilibili-ws/dist/index.mjs:5:49: ERROR: No matching export in "browser-external:node:zlib" for import "inflate"
    at failureErrorWithLog (C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:1624:15)
    at C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:1266:28
    at runOnEndCallbacks (C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:1046:63)
    at buildResponseToResult (C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:1264:7)
    at C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:1377:14
    at C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:678:9
    at handleIncomingPacket (C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:775:9)
    at Socket.readFromStdout (C:\Users\why00\Documents\project\bubblebox-web\node_modules\.pnpm\[email protected]\node_modules\esbuild\lib\main.js:644:7)
    at Socket.emit (node:events:526:28)
    at addChunk (node:internal/streams/readable:315:12)

貌似和这个issues 是同一个原因。
我暂时还不知道有什么解决方法。

安装

yarn add blive-message-listener

引入错误：

Error: require() of ES Module C:\Users\why00\Documents\project\2someone-app\node_modules\blive-message-listener\dist\index.js from C:\Users\why00\Documents\project\2someone-app\dist\preload\index.js not supported.
Instead change the require of C:\Users\why00\Documents\project\2someone-app\node_modules\blive-message-listener\dist\index.js in C:\Users\why00\Documents\project\2someone-app\dist\preload\index.js to a dynamic import() which is available in all CommonJS modules.
    at __node_internal_captureLargerStackTrace (node:internal/errors:465:5)
    at new NodeError (node:internal/errors:372:5)
    at Module._extensions..js (node:internal/modules/cjs/loader:1148:19)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Module._load (node:internal/modules/cjs/loader:829:12)
    at c._load (node:electron/js2c/asar_bundle:5:13343)
    at i._load (node:electron/js2c/renderer_init:33:356)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (C:\Users\why00\Documents\project\2someone-app\dist\preload\index.js:3:37)
    at Object.<anonymous> (C:\Users\why00\Documents\project\2someone-app\dist\preload\index.js:13:3)
    at Module._compile (node:internal/modules/cjs/loader:1120:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1175:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Module._load (node:internal/modules/cjs/loader:829:12)
    at c._load (node:electron/js2c/asar_bundle:5:13343)
    at i._load (node:electron/js2c/renderer_init:33:356)
    at Object.<anonymous> (node:electron/js2c/renderer_init:73:2296)
    at ./lib/renderer/init.ts (node:electron/js2c/renderer_init:73:2423)
    at __webpack_require__ (node:electron/js2c/renderer_init:1:170)
    at node:electron/js2c/renderer_init:1:1242
    at ___electron_webpack_init__ (node:electron/js2c/renderer_init:1:1310)
    at node:electron/js2c/renderer_init:141:194
    at NativeModule.compileForInternalLoader (node:internal/bootstrap/loaders:312:7)
    at NativeModule.compileForPublicLoader (node:internal/bootstrap/loaders:252:10)
    at loadNativeModule (node:internal/modules/cjs/helpers:49:9)
    at Module._load (node:internal/modules/cjs/loader:811:15)
    at c._load (node:electron/js2c/asar_bundle:5:13343)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47

使用预加载脚本报错：

源代码：

// preload/index.ts
import { startListen } from 'blive-message-listener'
contextBridge.exposeInMainWorld(
  'biliApi',
  {
    startListen,
  },
)

// ****.vue
 window.biliApi.startListen(inputRoomId, handler)
console.log(typeof window.biliApi.startListen)     // undefine

报错：

TypeError: Cannot read properties of undefined (reading 'startListen')
    at DanmuTest.vue:31:5
    at callWithErrorHandling (runtime-core.esm-bundler.js:155:22)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:164:21)
    at hook.__weh.hook.__weh (runtime-core.esm-bundler.js:2684:29)
    at flushPostFlushCbs (runtime-core.esm-bundler.js:341:32)
    at render2 (runtime-core.esm-bundler.js:6234:9)
    at mount (runtime-core.esm-bundler.js:4424:25)
    at app.mount (runtime-dom.esm-bundler.js:1606:23)
    at main.ts:4:16

大佬能从报错看出问题吗？如果需要看源码请直接回复。

在弹幕消息中，info[3][7, 8, 9] 字段是三个渐变色，B 站官方一般选用这个作为牌子的颜色。牌子的话应该就是拿 CSS 的 background-color: linear-gradient 来渲染的。

SEND_GIFT 的消息中好像也有个 medal_color_start, medal_color_end，但是它只有两个，而 medal_color 应该是跟 info[3][4] 同步的。

https://github.com/ddiu8081/blive-message-listener/blob/7db1bd4f143875761e38f2139309b87f8948f3b2/src/index.ts#L6

如果需要断开 TCP/WS 连接，simon300000/bilibili-live-ws 提供了 live.close() 方法。
但是本项目中 live 并没有返回，是否有可能把 live 一并作为 startListen() 的返回值，以方便关闭连接？

当某位 UP 发起一次天选之人时，会有大量的抽奖弹幕，在一定程度上会挤掉文字性弹幕。此处我使用了白河愁的直播间（老白真的好喜欢抽奖）。

改进方案：可以通过弹幕消息中的 data.info[0][9] 字段初步判断是不是抽奖弹幕，当这个字段不是 0，则可能是抽奖弹幕，在 我的分析 中给出了初步的判断

上图中颜文字弹幕就是抽奖弹幕