@rexnow/rslib-plugin 3.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Baran
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,308 @@
+# @rexnow/rslib-plugin
+
+[![NPM Version](https://img.shields.io/npm/v/@rexnow/rslib-plugin)](https://www.npmjs.com/package/@rexnow/rslib-plugin)
+![NPM License](https://img.shields.io/npm/l/@rexnow/rslib-plugin)
+
+> Rex Widget 专用的 Rslib 构建插件
+
+## 🚀 简介
+
+`@rexnow/rslib-plugin` 是一个专为 Rex Widget 开发优化的 Rslib 插件。它提供了以下核心功能：
+
+- 🔧 **自动类型生成**：根据 `WidgetMetadata` 自动生成 TypeScript 类型定义
+- 📦 **构建优化**：清除 Rex Widget 不支持的导出声明
+- 🛠️ **开发体验**：提供完整的类型支持和智能提示
+- 🔄 **热更新**：开发模式下自动重新生成类型定义
+
+## 📦 安装
+
+```bash
+npm install -D @rexnow/rslib-plugin
+# 或
+yarn add -D @rexnow/rslib-plugin
+# 或
+pnpm add -D @rexnow/rslib-plugin
+```
+
+## 🛠️ 使用方法
+
+### 基础配置
+
+在你的 `rslib.config.ts` 文件中添加插件：
+
+```ts
+import { pluginRexWidget } from '@rexnow/rslib-plugin';
+import { defineConfig } from '@rslib/core';
+
+export default defineConfig({
+  plugins: [pluginRexWidget()],
+  lib: [
+    {
+      format: 'esm',
+      syntax: ['node 18'],
+      dts: true,
+    },
+  ],
+});
+```
+
+### 自定义配置
+
+```ts
+import { pluginRexWidget } from '@rexnow/rslib-plugin';
+import { defineConfig } from '@rslib/core';
+
+export default defineConfig({
+  plugins: [
+    pluginRexWidget({
+      typesFilePath: 'src/custom-types.d.ts', // 自定义类型文件路径
+    }),
+  ],
+  lib: [
+    {
+      format: 'esm',
+      syntax: ['node 18'],
+      dts: true,
+    },
+  ],
+});
+```
+
+## 📋 配置选项
+
+| 选项 | 类型 | 默认值 | 描述 |
+|------|------|--------|------|
+| `typesFilePath` | `string` | `'src/rex-widget-env.d.ts'` | 生成的类型定义文件路径 |
+
+## 💡 工作原理
+
+### 1. 解析 WidgetMetadata
+
+插件会解析你的代码中的 `WidgetMetadata` 对象：
+
+```ts
+// src/index.ts
+WidgetMetadata = {
+  id: 'my-widget',
+  title: 'My Widget',
+  modules: [
+    {
+      id: 'search-module',
+      title: 'Search Module',
+      functionName: 'searchContent',
+      description: 'Search for content',
+      params: [
+        {
+          name: 'query',
+          title: 'Search Query',
+          type: 'input',
+        },
+        {
+          name: 'category',
+          title: 'Category',
+          type: 'enumeration',
+          enumOptions: [
+            { title: 'Movies', value: 'movies' },
+            { title: 'TV Shows', value: 'tvshows' },
+          ],
+        },
+      ],
+    },
+  ],
+};
+```
+
+### 2. 生成类型定义
+
+插件会根据 `WidgetMetadata` 自动生成相应的类型定义：
+
+```ts
+// src/rex-widget-env.d.ts
+/// <reference types='@rexnow/libs/env' />
+
+//#region search-module
+/**
+ * Params of Search Module
+ */
+interface SearchContentParams {
+  /**
+   * Search Query
+   */
+  query: string;
+  /**
+   * Category
+   */
+  category: 'movies' | 'tvshows';
+}
+
+/**
+ * Search Module
+ * @description Search for content
+ * @param {SearchContentParams} params
+ * @returns {Promise<VideoItem[]>}
+ */
+function searchContent(params: SearchContentParams): Promise<VideoItem[]>;
+
+/**
+ * Search Module
+ */
+type SearchContentType = typeof searchContent;
+//#endregion search-module
+```
+
+### 3. 清除导出声明
+
+插件会自动清除构建输出中的导出声明，因为 Rex Widget 不支持脚本有导出声明。
+
+## 📚 完整示例
+
+### 项目结构
+
+```
+my-widget/
+├── src/
+│   ├── index.ts                    # 主要逻辑
+│   └── rex-widget-env.d.ts     # 自动生成的类型定义
+├── rslib.config.ts                 # 构建配置
+├── package.json
+└── tsconfig.json
+```
+
+### 源代码示例
+
+```ts
+// src/index.ts
+WidgetMetadata = {
+  id: 'movie-search',
+  title: '电影搜索',
+  modules: [
+    {
+      id: 'search',
+      title: '搜索电影',
+      functionName: 'searchMovies',
+      description: '根据关键词搜索电影',
+      params: [
+        {
+          name: 'keyword',
+          title: '关键词',
+          type: 'input',
+        },
+        {
+          name: 'year',
+          title: '年份',
+          type: 'input',
+        },
+        {
+          name: 'genre',
+          title: '类型',
+          type: 'enumeration',
+          enumOptions: [
+            { title: '动作', value: 'action' },
+            { title: '喜剧', value: 'comedy' },
+            { title: '剧情', value: 'drama' },
+          ],
+        },
+      ],
+    },
+  ],
+};
+
+// 实现搜索函数
+async function searchMovies(params: SearchMoviesParams): Promise<VideoItem[]> {
+  const { keyword, year, genre } = params;
+  
+  // 使用 Widget API 进行搜索
+  const response = await Widget.http.get('https://api.example.com/search', {
+    params: { q: keyword, year, genre },
+  });
+  
+  return response.data.map(item => ({
+    id: item.id,
+    title: item.title,
+    year: item.year,
+    // ... 其他字段
+  }));
+}
+```
+
+### 生成的类型定义
+
+```ts
+// src/rex-widget-env.d.ts (自动生成)
+/// <reference types='@rexnow/libs/env' />
+
+//#region search
+/**
+ * Params of 搜索电影
+ */
+interface SearchMoviesParams {
+  /**
+   * 关键词
+   */
+  keyword: string;
+  /**
+   * 年份
+   */
+  year: string;
+  /**
+   * 类型
+   */
+  genre: 'action' | 'comedy' | 'drama';
+}
+
+/**
+ * 搜索电影
+ * @description 根据关键词搜索电影
+ * @param {SearchMoviesParams} params
+ * @returns {Promise<VideoItem[]>}
+ */
+function searchMovies(params: SearchMoviesParams): Promise<VideoItem[]>;
+
+/**
+ * 搜索电影
+ */
+type SearchMoviesType = typeof searchMovies;
+//#endregion search
+```
+
+## 🎯 支持的参数类型
+
+插件支持以下参数类型的自动类型生成：
+
+| 参数类型 | 描述 | 生成的 TypeScript 类型 |
+|----------|------|----------------------|
+| `input` | 输入框 | `string` |
+| `enumeration` | 枚举选择 | `'option1' \| 'option2' \| ...` |
+| `constant` | 常量值 | `'constantValue'` |
+
+## 🔧 开发模式
+
+在开发模式下，插件会监听文件变化并自动重新生成类型定义：
+
+```bash
+# 启动开发模式
+npm run dev
+# 或
+pnpm dev
+```
+
+## 🤝 最佳实践
+
+1. **保持 WidgetMetadata 结构清晰**：确保每个模块都有明确的 ID 和功能定义
+2. **使用描述性的函数名**：函数名应该清晰地表达其功能
+3. **提供完整的参数描述**：为每个参数提供有意义的标题和描述
+4. **合理组织模块**：将相关功能组织在一起，避免模块过于复杂
+
+## 📚 相关文档
+
+- [@rexnow/libs](../libs/README.md) - 核心工具库
+- [create-rex-widget](../create-rex-widget/README.md) - 脚手架工具
+- [Rex Widget 开发指南](https://docs.forward-widget.com)
+
+## 🤝 贡献
+
+欢迎提交 Issue 和 Pull Request 来改善这个项目。
+
+## 📄 许可证
+
+MIT License

package/dist/dev-server/directory.d.ts

@@ -0,0 +1,13 @@
+/** @jsxImportSource hono/jsx */
+import { Hono } from 'hono';
+import type { HonoEnv } from './types.js';
+interface FileInfo {
+    name: string;
+    size: number | null;
+}
+interface DirectoryProps {
+    fileInfos: FileInfo[];
+}
+export declare const Directory: ({ fileInfos }: DirectoryProps) => import("hono/jsx/jsx-dev-runtime").JSX.Element;
+export declare const directoryRouter: Hono<HonoEnv, import("hono/types").BlankSchema, "/">;
+export {};

package/dist/dev-server/index.d.ts

@@ -0,0 +1,6 @@
+import type { RsbuildPluginAPI } from '@rsbuild/core';
+export interface DevServerOptions {
+    api: RsbuildPluginAPI;
+    port: number;
+}
+export declare const createDevServer: (options: DevServerOptions) => Promise<import("@hono/node-server").ServerType>;

package/dist/dev-server/types.d.ts

@@ -0,0 +1,6 @@
+import type { Env } from 'hono';
+export interface HonoEnv extends Env {
+    Variables: {
+        distPath: string;
+    };
+}

package/dist/dev-server.js

@@ -0,0 +1,234 @@
+import { networkInterfaces } from "node:os";
+import { serve } from "@hono/node-server";
+import { serveStatic } from "@hono/node-server/serve-static";
+import { Hono } from "hono";
+import { Fragment, jsx, jsxs } from "hono/jsx/jsx-runtime";
+import { readdir, stat } from "node:fs/promises";
+import { join } from "node:path";
+const formatFileSize = (size)=>{
+    if (null === size) return '';
+    if (size < 1024) return `${size} B`;
+    if (size < 1048576) return `${(size / 1024).toFixed(1)} KB`;
+    if (size < 1073741824) return `${(size / 1048576).toFixed(1)} MB`;
+    return `${(size / 1073741824).toFixed(1)} GB`;
+};
+const FileItem = ({ fileInfo })=>{
+    const sizeText = formatFileSize(fileInfo.size);
+    return /*#__PURE__*/ jsx("li", {
+        class: "file-item",
+        children: /*#__PURE__*/ jsxs("a", {
+            href: `/${fileInfo.name}`,
+            class: "file-link",
+            children: [
+                /*#__PURE__*/ jsx("span", {
+                    class: "file-name",
+                    children: fileInfo.name
+                }),
+                /*#__PURE__*/ jsx("span", {
+                    class: "file-size",
+                    children: sizeText
+                })
+            ]
+        })
+    });
+};
+const Directory = ({ fileInfos })=>/*#__PURE__*/ jsxs("html", {
+        lang: "zh-CN",
+        children: [
+            /*#__PURE__*/ jsxs("head", {
+                children: [
+                    /*#__PURE__*/ jsx("meta", {
+                        charset: "utf-8"
+                    }),
+                    /*#__PURE__*/ jsx("title", {
+                        children: "Rex Widget - 文件列表"
+                    }),
+                    /*#__PURE__*/ jsx("style", {
+                        children: `
+            * { margin: 0; padding: 0; box-sizing: border-box; }
+            :root {
+              --bg-1: #000e1a;
+              --bg-2: #071221;
+              --bg-3: #00383d;
+              --card-bg: rgba(20, 20, 22, 0.55);
+              --card-border: rgba(255, 255, 255, 0.08);
+              --divider: rgba(255, 255, 255, 0.08);
+              --text-primary: #ffffff;
+              --text-secondary: rgba(255, 255, 255, 0.6);
+              --text-tertiary: rgba(255, 255, 255, 0.5);
+              --hover-bg: rgba(255, 255, 255, 0.06);
+            }
+            body { 
+              font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 
+              background: linear-gradient(135deg, var(--bg-1) 0%, var(--bg-2) 50%, var(--bg-3) 100%);
+              min-height: 100vh;
+              color: var(--text-primary);
+              padding: calc(env(safe-area-inset-top, 0px) + 12px) 16px calc(env(safe-area-inset-bottom, 0px) + 16px);
+            }
+            .container { 
+              max-width: 800px; 
+              margin: 0 auto; 
+            }
+            .header {
+              padding: 24px 0 12px;
+            }
+            h1 { 
+              color: var(--text-primary); 
+              font-size: 32px;
+              font-weight: 700;
+              margin-bottom: 6px;
+              text-align: left;
+            }
+            .content {
+              padding: 0;
+            }
+            .file-list { 
+              list-style: none; 
+              background: var(--card-bg);
+              border-radius: 18px;
+              overflow: hidden;
+              border: 1px solid var(--card-border);
+              backdrop-filter: blur(8px);
+            }
+            .file-item { 
+              display: flex; 
+              align-items: center;
+              padding: 18px 16px;
+              border-bottom: 1px solid var(--divider);
+              transition: background-color 0.2s ease;
+            }
+            .file-item:last-child {
+              border-bottom: none;
+            }
+            .file-item:hover { 
+              background-color: var(--hover-bg);
+            }
+            .file-link { 
+              text-decoration: none; 
+              color: var(--text-primary); 
+              display: flex; 
+              align-items: center; 
+              flex: 1;
+              font-size: 16px;
+              font-weight: 400;
+            }
+            .file-name { 
+              flex: 1;
+              margin-right: 8px;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+            }
+            .file-size { 
+              color: var(--text-tertiary); 
+              font-size: 14px;
+              font-weight: 400;
+              min-width: 72px; 
+              text-align: right;
+              margin-right: 8px;
+            }
+            .empty-message { 
+              text-align: center; 
+              color: var(--text-tertiary); 
+              padding: 60px 20px;
+              font-size: 16px;
+            }
+            .section-title {
+              color: var(--text-secondary);
+              font-size: 13px;
+              font-weight: 400;
+              text-transform: uppercase;
+              letter-spacing: 0.5px;
+              margin: 30px 0 8px 0;
+              text-align: left;
+            }
+          `
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx("body", {
+                children: /*#__PURE__*/ jsxs("div", {
+                    class: "container",
+                    children: [
+                        /*#__PURE__*/ jsx("div", {
+                            class: "header",
+                            children: /*#__PURE__*/ jsx("h1", {
+                                children: "文件列表"
+                            })
+                        }),
+                        /*#__PURE__*/ jsx("div", {
+                            class: "content",
+                            children: 0 === fileInfos.length ? /*#__PURE__*/ jsx("div", {
+                                class: "empty-message",
+                                children: "\uD83D\uDCED 此目录为空"
+                            }) : /*#__PURE__*/ jsxs(Fragment, {
+                                children: [
+                                    /*#__PURE__*/ jsx("div", {
+                                        class: "section-title",
+                                        children: "文件"
+                                    }),
+                                    /*#__PURE__*/ jsx("ul", {
+                                        class: "file-list",
+                                        children: fileInfos.map((fileInfo)=>/*#__PURE__*/ jsx(FileItem, {
+                                                fileInfo: fileInfo
+                                            }, fileInfo.name))
+                                    })
+                                ]
+                            })
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+const directoryRouter = new Hono();
+directoryRouter.get('/', async (c)=>{
+    const distPath = c.get('distPath');
+    const files = await readdir(distPath);
+    const fileInfos = await Promise.all(files.map(async (file)=>{
+        const filePath = join(distPath, file);
+        const stats = await stat(filePath);
+        return {
+            name: file,
+            size: stats.isFile() ? stats.size : null
+        };
+    }));
+    return c.html(/*#__PURE__*/ jsx(Directory, {
+        fileInfos: fileInfos
+    }));
+});
+const getLocalIPs = ()=>{
+    const interfaces = networkInterfaces();
+    const ips = [];
+    for (const name of Object.keys(interfaces)){
+        const nets = interfaces[name];
+        if (nets) {
+            for (const net of nets)if ('IPv4' === net.family && !net.internal) ips.push(net.address);
+        }
+    }
+    return ips;
+};
+const createDevServer = async (options)=>{
+    const { api, port } = options;
+    const app = new Hono();
+    app.use('*', serveStatic({
+        root: api.context.distPath
+    }));
+    app.use('*', (c, next)=>{
+        c.set('distPath', api.context.distPath);
+        return next();
+    });
+    app.route('/', directoryRouter);
+    const server = serve({
+        fetch: app.fetch,
+        port
+    });
+    const localIPs = getLocalIPs();
+    api.logger.ready("Rex Widget 插件已启动，监听地址");
+    api.logger.info(`  http://localhost:${port}`);
+    if (localIPs.length > 0) localIPs.forEach((ip)=>{
+        api.logger.info(`  http://${ip}:${port}`);
+    });
+    return server;
+};
+export { createDevServer };

package/dist/generators/danmu.d.ts

@@ -0,0 +1,5 @@
+import type { SourceFile } from "ts-morph";
+/**
+ * 生成弹幕模块接口
+ */
+export declare function generateDanmuModuleInterfaces(nameSpaceName: string, sourceFile: SourceFile, module: WidgetModule): void;

package/dist/generators/stream.d.ts

@@ -0,0 +1,2 @@
+import type { SourceFile } from "ts-morph";
+export declare function generateStreamModuleInterface(nameSpaceName: string, sourceFile: SourceFile, module: WidgetModule): void;

package/dist/generators/subtitle.d.ts

@@ -0,0 +1,2 @@
+import type { SourceFile } from "ts-morph";
+export declare function generateSubtitleModuleInterface(nameSpaceName: string, sourceFile: SourceFile, module: WidgetModule): void;

package/dist/generators/video.d.ts

@@ -0,0 +1,5 @@
+import type { SourceFile } from 'ts-morph';
+/**
+ * 生成 Video 模块接口
+ */
+export declare function generateVideoModuleInterface(nameSpaceName: string, sourceFile: SourceFile, module: WidgetModule): void;

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+import type { RsbuildPlugin } from "@rsbuild/core";
+interface RexWidgetPluginOptions {
+    /**
+     * 生成的 dts 文件路径
+     * @default `src/rex-widget-env.d.ts`
+     */
+    typesFilePath?: string;
+    /**
+     * 监听端口
+     * @default 8000
+     */
+    devPort?: number;
+}
+export declare const pluginRexWidget: ({ typesFilePath, devPort, }?: RexWidgetPluginOptions) => RsbuildPlugin;
+export {};