# @alicloud/alfa-react 中文文档

规范地址：https://npmcn.com/package/%40alicloud/alfa-react/

版本：2\.1\.0
npm 元数据更新时间：2026-08-06T08:20:18.522Z
中文译文更新时间：2026-11-05T19:07:36.514Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40alicloud/alfa-react
原文对照：https://npmcn.com/package/%40alicloud/alfa-react/?lang=original

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：224 kB，100 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：12 个
- peer 依赖：react \>=16\.0\.0，react-dom \>=16\.0\.0
- 首次发布：2020-11-09T09:01:34.217Z
- 最新版本发布：2026-08-06T08:20:18.310Z
- 近 30 天下载量：43931（2026-10-06 至 2026-11-04，npm 官方下载统计）
- 已发布版本数：234（近 12 个月 40 个）

## 中文简介

Alfa 框架( 反应版本)

## 安装

```sh
npm install @alicloud/alfa-react
```

也可以使用：`pnpm add @alicloud/alfa-react`、`yarn add @alicloud/alfa-react`、`bun add @alicloud/alfa-react`

## README

# Alfa( 反应版本)

API CH 反应 QQ , QQ。

# 使用量

· 国家

```javascript
import { createAlfaWidget, createAlfaApp } from '@alicloud/alfa-react';

const AlfaMicroApp = createAlfaWidget({
  name: '@ali/example',
  version: '1.0'
});


const App = () => {
  return <AlfaMicroApp />
}
```

部件

```javascript
import { createAlfaWidget } from '@alicloud/alfa-react';

const AlfaWidget = createAlfaWidget({
  name: '@ali/example',
  version: '1.x'
});


const App = () => {
  return <AlfaWidget />
}
```

```javascript
import { createAlfaWidget } from '@alicloud/alfa-react';

const AlfaWidget = createAlfaWidget({
  name: '@ali/example',
  url: 'https://some-url/index.js',
  runtimeVersion: '1.9.3',
  env: 'pre'
});


const App = () => {
  return <AlfaWidget />
}
```

# API 密码

`createAlfaWidget(AlfaFactoryOption)` 或者说 `createAlfaApp(AlfaFactoryOption)`

## 事实选项

| 属性名 | 类型 | 页:1 | 默认值 |
| --- | --- | --- | --- |
| 名称 | `id: string;` | 部件或 alfa 应用程序标识 | \- 说吧 |
| 版本 | `version?: string;` | 微应用版本 | \- 说吧 |
| 环境 | "env":"prod" (英语) | 当地人 | "预" |
| 装入 | 装子弹 | 反应 反应儿童;\` | ++ 装入 ++ |
| url 密码 | `url?: string;` | JS 条目 CHL URL | \- 说吧 |
| 显示 | `url?: string;` | 控制台 CH 显示 | \- 说吧 |

## 部件事实选项

`createAlfaWidget(WidgetFactoryOption)`

| 属性名 | 类型 | 页:1 | 默认值 |
| --- | --- | --- | --- |
| 名称 | `id: string;` | 部件或 alfa 应用程序标识 | \- 说吧 |
| 版本 | `version: string;` | 微应用版本 | \- 说吧 |
| 环境 | "env":"prod" (英语) | 当地人 | "预" |
| 装入 | 装子弹 | 反应 反应儿童;\` | ++ 装入 ++ |
| url 密码 | `url?: string;` | JS 条目 CHL URL | \- 说吧 |
| 运行时间 | `runtimeVersion?: string;` | Widgtet 运行时间 {} | \- 说吧 |

## 部件事件编辑器

```javascript
import { widgetEventEmitter } from '@alicloud/alfa-react'; 

widgetEventEmitter.on('event', handleEvent)

widgetEventEmitter.emit('event', [a, b])
```

## 常见问题

### @alicloud/alfa-react 是什么？

Alfa 框架\( 反应版本\)

### 如何安装 @alicloud/alfa-react？

在项目目录运行 npm install @alicloud/alfa-react，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>=16\.0\.0）、react-dom（\>=16\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @alicloud/alfa-react 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @alicloud/alfa-react 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @alicloud/alfa-react 可以商用吗？

@alicloud/alfa-react 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @alicloud/alfa-react 的下载量有多少？

根据 npm 官方下载统计，@alicloud/alfa-react 在 2026/10/06 – 2026/11/04 这 30 天内被下载 43,931 次，日均约 1,464 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @alicloud/alfa-react 还在维护吗？

最新版本 2\.1\.0 发布于 2026/08/06（3 个月前）；至今共发布 234 个版本，其中过去 12 个月发布了 40 个；首次发布于 2020/11/09。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。