[[["容易理解","easyToUnderstand","thumb-up"],["確實解決了我的問題","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少我需要的資訊","missingTheInformationINeed","thumb-down"],["過於複雜/步驟過多","tooComplicatedTooManySteps","thumb-down"],["過時","outOfDate","thumb-down"],["翻譯問題","translationIssue","thumb-down"],["示例/程式碼問題","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新時間：2025-07-24 (世界標準時間)。"],[],[],null,["# Setup guide for web\n\nThis page shows you how to set up your development environment to use MediaPipe\nTasks in your JavaScript web applications.\n\nSupported platforms and versions\n--------------------------------\n\nTo create web applications with MediaPipe Tasks, your development environment\nrequires the following:\n\n- Chrome or Safari browser\n- A web application that uses Node.js and NPM. Alternatively, you can use script tags to access MediaPipe Tasks through a content delivery network (CDN).\n\nMediaPipe Tasks dependencies\n----------------------------\n\nMediaPipe Tasks provides three prebuilt libraries for vision, text, and audio.\nDepending on the MediaPipe Task used by the app, import the vision, text, or\naudio library into your development project.\n| **Attention:** This MediaPipe Solutions Preview is an early release. [Learn more](/edge/mediapipe/solutions/about#notice).\n\n### Generative AI tasks\n\nThe MediaPipe Tasks Generative AI module contains tasks that handle image or\ntext generation. To import the MediaPipe Tasks Generative AI libraries, import the\nfollowing dependencies into your development project.\n\n#### LLM Inference API\n\nThe MediaPipe LLM Inference task is contained within the `tasks-genai` library. \n\n npm install @mediapipe/tasks-genai\n\nIf you want to deploy to a server, you can use a content delivery network (CDN)\nservice, such as [jsDelivr](https://www.jsdelivr.com/), to add code directly to\nyour HTML page. \n\n \u003chead\u003e\n \u003cscript src=\"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai/genai_bundle.cjs\"\n crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n \u003c/head\u003e\n\n### Vision tasks\n\nThe MediaPipe Tasks vision module contains tasks that handle image or video\ninputs. To import the MediaPipe Tasks vision library, import the following\ndependency to your into your development project. \n\n npm install @mediapipe/tasks-vision\n\nIf you want to deploy to a server, you can use a content delivery network (CDN)\nservice, such as [jsDelivr](https://www.jsdelivr.com/), to add code directly to\nyour HTML page. \n\n \u003chead\u003e\n \u003cscript src=\"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js\"\n crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n \u003c/head\u003e\n\n### Text tasks\n\nThe MediaPipe Tasks text module contains tasks that handle string inputs. To\nimport the MediaPipe Tasks text library, import the following dependency to your\ninto your development project. \n\n npm install @mediapipe/tasks-text\n\nIf you want to deploy to a server, you can use a content delivery network (CDN)\nservice, such as [jsDelivr](https://www.jsdelivr.com/), to add code directly to\nyour HTML page. \n\n \u003chead\u003e\n \u003cscript src=\"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-text/text_bundle.js\"\n crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n \u003c/head\u003e\n\n### Audio tasks\n\nThe MediaPipe Tasks audio module contains tasks that handle sound inputs. To\nimport the MediaPipe Tasks audio library, import the following dependency to\nyour into your development project. \n\n npm install @mediapipe/tasks-audio\n\nIf you want to deploy to a server, you can use a content delivery network (CDN)\nservice, such as [jsDelivr](https://www.jsdelivr.com/), to add code directly to\nyour HTML page. \n\n \u003chead\u003e\n \u003cscript src=\"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-audio/audio_bundle.js\"\n crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n \u003c/head\u003e\n\nBaseOptions configuration\n-------------------------\n\nThe BaseOptions allow for general configuration of MediaPipe Task APIs.\n\n| Option name | Description | Accepted values |\n|--------------------|--------------------------------------------------------------------------------------------------------------|----------------------|\n| `modelAssetBuffer` | The model asset file contents as a `Uint8Array` typed array. | `Uint8Array` |\n| `modelAssetPath` | The path of the model asset to open and map into memory. | `TrustedResourceUrl` |\n| `Delegate` | Enables hardware acceleration through a device delegate to run the MediaPipe pipeline. Default value: `CPU`. | \\[`CPU`, `GPU`\\] |\n\nTroubleshooting\n---------------\n\nFor help with technical questions related to MediaPipe, visit the [discussion\ngroup](https://groups.google.com/forum/#!forum/mediapipe) or [Stack\nOverflow](https://stackoverflow.com/questions/tagged/mediapipe) for support from\nthe community. To report bugs or make feature requests, [file an issue on\nGitHub](https://github.com/google/mediapipe/issues)."]]
