初始化项目结构

.gitignore

@@ -0,0 +1,30 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+.DS_Store
+dist
+dist-ssr
+coverage
+*.local
+
+/cypress/videos/
+/cypress/screenshots/
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+*.tsbuildinfo

env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

index.html

@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+
+<head>
+  <meta charset="UTF-8">
+  <link rel="icon" href="/favicon.ico">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>抖音弹幕姬</title>
+</head>
+
+<body>
+  <div id="app"></div>
+  <script type="module" src="/src/main.ts"></script>
+</body>
+
+</html>

package.json

@@ -0,0 +1,32 @@
+{
+  "name": "dycast",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "run-p type-check \"build-only {@}\" --",
+    "preview": "vite preview",
+    "build-only": "vite build",
+    "type-check": "vue-tsc --build"
+  },
+  "dependencies": {
+    "@types/vue-virtual-scroller": "npm:@earltp/vue-virtual-scroller@^1.0.1",
+    "pako": "^2.1.0",
+    "sass": "^1.87.0",
+    "vue": "^3.5.13",
+    "vue-virtual-scroller": "2.0.0-beta.8"
+  },
+  "devDependencies": {
+    "@tsconfig/node22": "^22.0.1",
+    "@types/node": "^22.14.0",
+    "@types/pako": "^2.0.3",
+    "@vitejs/plugin-vue": "^5.2.3",
+    "@vue/tsconfig": "^0.7.0",
+    "npm-run-all2": "^7.0.2",
+    "typescript": "~5.8.0",
+    "vite": "^6.2.4",
+    "vite-plugin-vue-devtools": "^7.7.2",
+    "vue-tsc": "^2.2.8"
+  }
+}

server.py

@@ -0,0 +1,21 @@
+import asyncio
+import websockets
+import time
+
+async def echo(websocket, path):
+    async for message in websocket:
+        print(f'[{time.ctime()}]: ')
+        print(message)
+        message = "服务端获取到消息: {}".format(message)
+        await websocket.send(message)
+
+print('WebSocket服务启动成功，可通过 ws://localhost:8765 进行访问')
+
+asyncio.get_event_loop().run_until_complete(websockets.serve(echo, 'localhost', 8765))
+asyncio.get_event_loop().run_forever()
+
+'''
+# 创建一个WebSocket服务端
+# 用于接收解析到的弹幕数据
+# 测试弹幕转发功能
+'''

src/App.vue

@@ -0,0 +1,15 @@
+<template>
+  <IndexView />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import IndexView from './views/IndexView.vue';
+</script>
+
+<style lang="scss">
+body::selection {
+  background-color: #8b968d;
+  color: #fff;
+}
+</style>

src/assets/font/font.css

@@ -0,0 +1,203 @@
+/* 抖音美好体 */
+@font-face {
+  font-family: 'dymht';
+  ;
+  src: url('./DouyinSansBold.otf') format('opentype');
+}
+
+/* 猫啃忘形圆 */
+@font-face {
+  font-family: 'mkwxy';
+  src: url('./MaoKenWangXingYuan.ttf') format('truetype');
+}
+
+/* 图标 */
+@font-face {
+  font-family: "castfont";
+  src: url('castfont.ttf') format('truetype');
+}
+
+[class*=' ice-'],
+[class^='ice-'] {
+  font-family: 'castfont' !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.castfont {
+  font-family: "castfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.ice-fullscreen:before {
+  content: "\e658";
+}
+
+.ice-fullscreen-exit:before {
+  content: "\e659";
+}
+
+.ice-cast-wall-f:before {
+  content: "\e657";
+}
+
+.ice-file:before {
+  content: "\e689";
+}
+
+.ice-data:before {
+  content: "\e6da";
+}
+
+.ice-qr:before {
+  content: "\e634";
+}
+
+.ice-thank:before {
+  content: "\e727";
+}
+
+.ice-dir:before {
+  content: "\100d9";
+}
+
+.ice-coin:before {
+  content: "\e651";
+}
+
+.ice-add:before {
+  content: "\e6a7";
+}
+
+.ice-label:before {
+  content: "\e63d";
+}
+
+.ice-room-id:before {
+  content: "\e622";
+}
+
+.ice-record:before {
+  content: "\e642";
+}
+
+.ice-img:before {
+  content: "\e61e";
+}
+
+.ice-keyword:before {
+  content: "\e6d0";
+}
+
+.ice-stat:before {
+  content: "\e620";
+}
+
+.ice-opacity:before {
+  content: "\e724";
+}
+
+.ice-clock:before {
+  content: "\e631";
+}
+
+.ice-checkmark:before {
+  content: "\e715";
+}
+
+.ice-arrow-top:before {
+  content: "\e684";
+}
+
+.ice-arrow-left-copy:before {
+  content: "\e77d";
+}
+
+.ice-arrow-right-copy:before {
+  content: "\e77e";
+}
+
+.ice-arrow-bottom-copy:before {
+  content: "\e77f";
+}
+
+.ice-stick:before {
+  content: "\e677";
+}
+
+.ice-minimize:before {
+  content: "\e668";
+}
+
+.ice-maximize:before {
+  content: "\e65d";
+}
+
+.ice-close-b:before {
+  content: "\e661";
+}
+
+.ice-maximize-o:before {
+  content: "\e692";
+}
+
+.ice-cast-wall:before {
+  content: "\e653";
+}
+
+.ice-cast:before {
+  content: "\e601";
+}
+
+.ice-save:before {
+  content: "\e636";
+}
+
+.ice-copy:before {
+  content: "\e60c";
+}
+
+.ice-setting:before {
+  content: "\e771";
+}
+
+.ice-ip:before {
+  content: "\e77c";
+}
+
+.ice-port:before {
+  content: "\e643";
+}
+
+.ice-config:before {
+  content: "\e618";
+}
+
+.ice-close:before {
+  content: "\e69a";
+}
+
+.ice-help:before {
+  content: "\e6a3";
+}
+
+.ice-info:before {
+  content: "\e6a4";
+}
+
+.ice-success:before {
+  content: "\e6b1";
+}
+
+.ice-warn:before {
+  content: "\e6b6";
+}
+
+.ice-error:before {
+  content: "\e6b7";
+}

src/assets/main.css

@@ -0,0 +1,15 @@
+@import url('./font/font.css');
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  font-size: 16px;
+}
+
+
+#app {
+  width: 100%;
+  height: 100%;
+}

src/main.ts

@@ -0,0 +1,12 @@
+import './assets/main.css';
+
+import { createApp } from 'vue';
+import App from './App.vue';
+import VueVirtualScroller from 'vue-virtual-scroller';
+import 'vue-virtual-scroller/dist/vue-virtual-scroller.css';
+
+const app = createApp(App);
+
+app.use(VueVirtualScroller);
+
+app.mount('#app');

src/views/IndexView.vue

@@ -0,0 +1,10 @@
+<template>
+  <div class="index-view"></div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+</script>
+
+<style lang="scss" scoped>
+</style>

tsconfig.app.json

@@ -0,0 +1,20 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.dom.json",
+  "include": [
+    "env.d.ts",
+    "src/**/*",
+    "src/**/*.vue"
+  ],
+  "exclude": [
+    "src/**/__tests__/*"
+  ],
+  "compilerOptions": {
+    "allowJs": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ]
+    }
+  }
+}

tsconfig.json

@@ -0,0 +1,11 @@
+{
+  "files": [],
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    },
+    {
+      "path": "./tsconfig.app.json"
+    }
+  ]
+}

tsconfig.node.json

@@ -0,0 +1,20 @@
+{
+  "extends": "@tsconfig/node22/tsconfig.json",
+  "include": [
+    "vite.config.*",
+    "vitest.config.*",
+    "cypress.config.*",
+    "nightwatch.conf.*",
+    "playwright.config.*",
+    "eslint.config.*"
+  ],
+  "compilerOptions": {
+    "noEmit": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "types": [
+      "node"
+    ]
+  }
+}

vite.config.ts

@@ -0,0 +1,18 @@
+import { fileURLToPath, URL } from 'node:url';
+
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+// import vueDevTools from 'vite-plugin-vue-devtools';
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [
+    vue()
+    // vueDevTools(),
+  ],
+  resolve: {
+    alias: {
+      '@': fileURLToPath(new URL('./src', import.meta.url))
+    }
+  }
+});