---
url: /protocol-launcher/zh/extra/examples.md
---

# 示例

以下是在不同 JavaScript 框架中使用 protocol-launcher 的完整实例集合。

## React 生态

| 框架      | 在线演示                                                                                                                                       |
|---------|--------------------------------------------------------------------------------------------------------------------------------------------|
| React   | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-react)  |
| Next.js | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-nextjs) |
| Remix   | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-remix)  |

## Vue 生态

| 框架         | 在线演示                                                                                                                                       |
|------------|--------------------------------------------------------------------------------------------------------------------------------------------|
| Vue (2.x)  | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-vue2)   |
| Vue (3.x)  | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-vue3)   |
| Nuxt (2.x) | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-nuxt2)  |
| Nuxt (3.x) | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-nuxt3)  |
| Quasar     | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-quasar) |

## 其他框架

| 框架         | 在线演示                                                                                                                                           |
|------------|------------------------------------------------------------------------------------------------------------------------------------------------|
| Angular    | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-angular)    |
| Svelte     | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-svelte)     |
| SvelteKit  | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-svelte-kit) |
| Astro      | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-astro)      |
| Webpack    | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-webpack)    |
| Vanilla    | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-vanilla)    |
| IIFE (CDN) | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/protocol-launcher-iife)       |

## 使用提示

1. 点击任意 "Open in StackBlitz" 按钮即可查看实时示例
2. 各框架示例展示了推荐的集成模式