vite-plugin-worklet

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

特性

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

安装

``bash


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 中添加插件:

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

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

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

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

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

3. 在代码中使用 worklet:

`ts
import workletUrl from './audio.worklet.ts?worklet'
await audioContext.audioWorklet.addModule('workletUrl')
`
4. 如果你在使用 TypeScript，还有一个声明助手可以更好地推断类型。在 tsconfig.json 中添加以下内容：

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

配置

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

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

环境要求

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