first

.trae/skills/vite/references/features-workers.md

@@ -0,0 +1,115 @@
+---
+name: features-workers
+description: Web Worker support in Vite
+---
+
+# Web Workers
+
+## Constructor Syntax (Recommended)
+
+Standard Web Worker creation:
+
+```ts
+const worker = new Worker(new URL('./worker.js', import.meta.url))
+```
+
+Module worker:
+
+```ts
+const worker = new Worker(new URL('./worker.js', import.meta.url), {
+  type: 'module'
+})
+```
+
+Shared Worker:
+
+```ts
+const sharedWorker = new SharedWorker(
+  new URL('./shared-worker.js', import.meta.url)
+)
+```
+
+**Note:** The `new URL()` must be used directly inside `new Worker()` for detection.
+
+## Query Suffix Syntax
+
+Import with `?worker` suffix:
+
+```ts
+import MyWorker from './worker?worker'
+
+const worker = new MyWorker()
+```
+
+Shared worker:
+
+```ts
+import MySharedWorker from './worker?sharedworker'
+
+const worker = new MySharedWorker()
+```
+
+### Inline Worker
+
+Inline as base64 string (no separate chunk):
+
+```ts
+import MyWorker from './worker?worker&inline'
+
+const worker = new MyWorker()
+```
+
+### Worker URL Only
+
+Get URL instead of constructor:
+
+```ts
+import workerUrl from './worker?worker&url'
+```
+
+## Worker Script
+
+Workers can use ESM `import` statements:
+
+```ts
+// worker.js
+import { heavyComputation } from './utils'
+
+self.onmessage = (e) => {
+  const result = heavyComputation(e.data)
+  self.postMessage(result)
+}
+```
+
+## Worker Options
+
+Configure worker bundling:
+
+```ts
+// vite.config.ts
+export default defineConfig({
+  worker: {
+    format: 'es',  // or 'iife'
+    plugins: () => [/* worker-specific plugins */],
+    rollupOptions: {
+      // Rollup options for worker bundle
+    }
+  }
+})
+```
+
+## WebAssembly in Workers
+
+```ts
+// worker.js
+import init from './module.wasm?init'
+
+init().then((instance) => {
+  instance.exports.compute()
+})
+```
+
+<!-- 
+Source references:
+- https://vite.dev/guide/features.html#web-workers
+-->