Transformers.js 示例项目教程

Transformers.js 示例项目教程

transformers.js-examples A collection of 🤗 Transformers.js demos and example applications 项目地址: https://gitcode.com/gh_mirrors/tr/transformers.js-examples

1. 项目目录结构及介绍

本项目是 Hugging Face 的 Transformers.js 示例集合，展示了如何使用 JavaScript 版本的 Transformers 库构建各种应用。以下是项目的目录结构及各部分的简要介绍：

transformers.js-examples/
├── .gitignore                # 忽略文件列表
├── .prettierrc               # Prettier 配置文件
├── LICENSE                   # 项目许可证信息
├── README.md                 # 项目说明文件
├── package-lock.json         # 包版本锁定文件
├── package.json              # 项目包配置文件
├── scripts/                  # 脚本文件夹
├── adaptive-retrieval/       # 适应性检索示例
├── attention-visualization/  # 注意力可视化示例
├── browser-extension/        # 浏览器扩展示例
├── bun/                      # 使用 Bun 运行时环境示例
├── code-completion/          # 代码补全示例
├── cross-encoder/            # 交叉编码器示例
├── deepseek-r1-webgpu/       # 深度搜索示例（WebGPU）
├── deno-embed/               # 使用 Deno 运行时环境示例
├── depth-anything/           # 深度估计示例
├── depth-estimation-video/   # 视频深度估计示例
├── depth-pro-node/           # 深度处理示例（Node.js）
├── florence2-webgpu/         # Florence 2 模型示例（WebGPU）
├── gemma-2-2b-jpn-webgpu/    # Gemma-2.2b 模型示例（WebGPU）
├── janus-pro-webgpu/         # Janus Pro 模型示例（WebGPU）
├── janus-webgpu/             # Janus 模型示例（WebGPU）
├── llama-3.2-node/           # Llama-3.2 模型示例（Node.js）
├── llama-3.2-reasoning-webgpu/ # Llama-3.2 推理示例（WebGPU）
├── llama-3.2-webgpu/         # Llama-3.2 模型示例（WebGPU）
├── moonshine-web/            # Moonshine 模型示例（Web）
├── musicgen-web/             # 音乐生成示例（Web）
├── next-client/              # Next.js 客户端示例
├── next-server/              # Next.js 服务器示例
├── node-audio-processing/    # Node.js 音频处理示例
├── node-cjs/                 # Node.js CommonJS 模块示例
├── node-esm/                 # Node.js ECMAScript 模块示例
├── omniparser-node/          # 全能解析器示例（Node.js）
├── pglite-semantic-search/   # PGLite 语义搜索示例
├── phi-3.5-webgpu/           # Phi-3.5 模型示例（WebGPU）
├── realtime-whisper-webgpu/  # 实时 Whisper 示例（WebGPU）
├── remove-background-web/    # 移除背景示例（Web）
├── remove-background-webgpu/ # 移除背景示例（WebGPU）
├── sapiens-node/             # Sapiens 模型示例（Node.js）
├── segment-anything-webgpu/  # Segment Anything 示例（WebGPU）
├── semantic-audio-search/    # 语义音频搜索示例
├── semantic-image-search-web/ # 语义图像搜索示例（Web）
├── smollm-webgpu/            # SmolLM 模型示例（WebGPU）
├── smolvlm-webgpu/           # SmolVLM 模型示例（WebGPU）
├── speecht5-web/             # SpeechT5 示例（Web）
├── sveltekit/                # SvelteKit 示例
├── text-to-speech-webgpu/    # 文字转语音示例（WebGPU）
├── the-tokenizer-playground/ # 分词器 playground 示例
├── tinyswallow-webgpu/       # TinySwallow 模型示例（WebGPU）
├── vanilla-js/               # 纯 JavaScript 示例
├── video-background-removal/ # 视频背景移除示例
├── video-object-detection/   # 视频对象检测示例
├── webgpu-clip/              # WebGPU CLIP 示例
├── webgpu-embedding-benchmark/ # WebGPU 嵌入基准测试示例
├── webgpu-nomic-embed/       # WebGPU Nomic 嵌入示例
├── whisper-node/             # Whisper 示例（Node.js）
├── whisper-word-timestamps/  # Whisper 单词时间戳示例
└── zero-shot-classification/ # 零样本分类示例

每个示例文件夹中都包含了运行特定功能所需的代码和资源。

2. 项目的启动文件介绍

每个示例都有自己的启动方式，通常情况下，你可以在示例目录中找到 index.js 或 index.html 文件作为入口点。以下是一些常见的启动方式：

• 对于 Node.js 示例，你可以使用如下命令启动项目：

node index.js

• 对于 Web 示例，你通常需要在浏览器中打开 index.html 文件。

3. 项目的配置文件介绍

项目的配置文件主要包括 package.json 和 .prettierrc。

• package.json：这个文件列出了项目的所有依赖项和脚本。你可以使用 npm install 命令安装依赖项，并使用 npm run <script> 运行定义好的脚本。

• .prettierrc：这个文件用于配置 Prettier 代码格式化工具的规则，以保证代码风格的一致性。

以上就是本开源项目的简要介绍，希望对你有所帮助。

transformers.js-examples A collection of 🤗 Transformers.js demos and example applications 项目地址: https://gitcode.com/gh_mirrors/tr/transformers.js-examples