vite-plugin-worklet

一个支持内联加载 JavaScript worklets（如 Audio Worklet、Paint Worklet 等）的 Vite 插件。

特性

• 🚀 与 Vite 无缝集成
• 📦 支持内联加载 worklet
• 🔧 支持 TypeScript
• ⚡️ 零配置，开箱即用

安装

# npm
npm install vite-plugin-worklet --save-dev

# yarn
yarn add vite-plugin-worklet -D

# pnpm
pnpm add vite-plugin-worklet -D

使用方法

1. 在 vite.config.ts 中添加插件:

import { defineConfig } from 'vite'
import worklet from 'vite-plugin-worklet'

export default defineConfig({
  plugins: [worklet()]
})

1. 创建 worklet 文件（例如：audio.worklet.ts?worklet）:

// audio.worklet.ts?worklet
class MyAudioProcessor extends AudioWorkletProcessor {
  process(inputs, outputs, parameters) {
    // 在这里编写音频处理代码
    return true
  }
}

registerProcessor('my-audio-processor', MyAudioProcessor)

3. 在代码中使用 worklet:

import workletUrl from './audio.worklet.ts?worklet'
await audioContext.audioWorklet.addModule('workletUrl')

4. 如果你在使用 TypeScript，还有一个声明助手可以更好地推断类型。在 tsconfig.json 中添加以下内容：

 "types": ["vite-plugin-worklet/client"]

配置

插件支持零配置使用，但如果需要，你也可以自定义配置：

worklet({
  include:[],
  exclude:[],
})

环境要求

• Vite 4.x 或 5.x
• Node.js 14.18+ / 16+