# @fluixi/vite-plugin 中文文档

规范地址：https://npmcn.com/package/%40fluixi/vite-plugin/

版本：1\.0\.0-alpha\.108
npm 元数据更新时间：2026-11-07T01:12:13.143Z
中文译文更新时间：2026-11-15T02:35:08.135Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40fluixi/vite-plugin
原文对照：https://npmcn.com/package/%40fluixi/vite-plugin/?lang=original
项目主页：https://github.com/fluixi/core#readme
源码仓库：https://github.com/fluixi/core

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

- 包体积（解压后）：141 kB，19 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：2 个
- peer 依赖：vite \>=4
- 首次发布：2026-07-10T03:17:09.777Z
- 最新版本发布：2026-11-07T01:09:37.952Z
- 近 30 天下载量：3532（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：56（近 12 个月 56 个）

## 中文简介

Fluixi的Vite插件——通过@fluixi/compiler(jsx或必需后端)来编译JSX.

## 安装

```sh
npm install @fluixi/vite-plugin
```

也可以使用：`pnpm add @fluixi/vite-plugin`、`yarn add @fluixi/vite-plugin`、`bun add @fluixi/vite-plugin`

## README

![Fluixi](https://raw.githubusercontent.com/fluixi/assets/main/logos/128x128.png)

# @fluixi/vite-plugin (英语)

**Fluixi 的 Vite 插件: 编译 JSX 和 `html` 模板.**

[![License: MIT](https://img.shields.io/badge/License-MIT-22c55e.svg)](https://npmcn.com/package/%40fluixi/vite-plugin/LICENSE) ![TypeScript](https://img.shields.io/badge/TypeScript-strict-3178c6?logo=typescript&logoColor=white) [![npm](https://img.shields.io/npm/v/@fluixi/vite-plugin?logo=npm)](https://www.npmjs.com/package/@fluixi/vite-plugin) ![Vite](https://img.shields.io/badge/built%20on-Vite-646cff?logo=vite&logoColor=white)

* * *

## \* 概览

`@fluixi/vite-plugin` 设置建置 `jsxImportSource` 并运行 Fluixi 编译 (通过) [`@fluixi/compiler`](https://npmcn.com/package/%40fluixi/compiler): 联合来文X和 `` html`...` `` 两者,直入 `@fluixi/dom` 运行时间电话。 它重写已存在的源, 因此输出带有源 地图和孔保留作者所写的文字。 没有Bayl装的. `@fluixi/core` 再出口 `fluixi`编号 :`createVitePlugin` 从这里,和 [`@fluixi/start`](https://npmcn.com/package/%40fluixi/start) 电线 在自动中:直接为平原(非元框)使用此插件.

## \* 安装

```sh
pnpm add -D @fluixi/vite-plugin
```

## 使用量

```ts
import { defineConfig } from 'vite';
import { fluixi } from '@fluixi/vite-plugin';

export default defineConfig({
  plugins: [
    // JSX and html`` templates both compile straight into @fluixi/dom runtime
    // calls (createNativeElement/spread/insert/…). No options required.
    fluixi(),
  ],
});
```

## QQ 选项

选项是 [`@fluixi/compiler`](https://npmcn.com/package/%40fluixi/compiler)是因为 `CompilerOptions`数字 :

| 选项 | 默认 | 什麽 |
| --- | --- | --- |
| `importSource` | `@fluixi/jsx` | 联合来文十 _类型_ 来源;以及 `jsxImportSource` 给建造 |
| `format` | `both` | 用于编译的语法 : `jsx`, (中文(简体) ), `html`,或 `both` |
| `signalModule` 编号 : `controlFlowModule` | `@fluixi/dom` | 发射的运行时符号来自何处 |
| `resolve` | \- 说吧 | 从赤色标签中导入组件的规则 |
| `globals` | `fluixi.d.ts` | 将生成的环境类型(解析组件和 `$signal`\- 风格的内在). `false` 跳过它 |
| `propsDestructure` | `true` | 将组件的解结构道具重写成属性读取,所以 `function Card({ title })` 不断更新。 无法证明的图案被保留下来 关上一个包裹 运送源头 |
| `templateClone` 编号 : `partialTemplates` | `true` | 克隆静态子树,而不是建树 |
| `delegateEvents` | `true` | 代表团 |
| `sourceMaps` | `true` | 发送源地图 |
| `babel` | `false` | 转而通过 Babel 前端编译,用于一个其自己的 Babel 插件必须查看输出的项目. 需求 `@babel/core`,这是一个可选的对等点 |
| `devtools` | 在 dev 中显示 | 服务运行中的应用程序的活性图形,并标记每个节点创建的地方. `{ external: true }` 标记依赖性也 |

## \* 反应图

插件在开发模式的页面上添加了一个小代理, 它报告反应图 `GET /__fluixi/graph`。这个图表作为普通的JSON提供,因此很容易在编辑器扩展或面板等工具中读取和使用。 代理机与插件相伴而来,因此一个项目不需要安装其他设备;只有框架本身从项目中解决,因为观看运行时间的第二个拷贝会观看一个没有用的图.

以下是您如何配置插件 :

```ts
// vite.config.ts
plugins: [fluixi()],                            // graph on in dev
plugins: [fluixi({ devtools: false })],         // off
plugins: [fluixi({ devtools: { external: true } })],  // dependencies too
```

图表中的每个节点都包含它创建时的文件,行和列,相对于工程根命名. 默认情况下,来自依赖关系的节点没有被标记,这可以保持图表对您正在编辑的代码的关注.

这个 `external` 选项对框架本身的工作有用。 它标志着节点从 `node_modules` 项目根外为 `external`,允许您看到哪些节点是由图书馆创建的,哪些是由您的应用程序创建的。 应用程序的调用站点优先于创建节点的包装器,所以 `count` 显示为您所写的行,而不是里面的行 `signal()`。 。 。 .

## 许可证

[麻省理工学院](https://npmcn.com/package/%40fluixi/vite-plugin/LICENSE) © [风花](https://fluixi.dev/)

## 常见问题

### @fluixi/vite-plugin 是什么？

Fluixi的Vite插件——通过@fluixi/compiler\(jsx或必需后端\)来编译JSX\.

### 如何安装 @fluixi/vite-plugin？

在项目目录运行 npm install @fluixi/vite-plugin，或使用 pnpm add / yarn add / bun add。

### @fluixi/vite-plugin 支持 TypeScript 吗？

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

### @fluixi/vite-plugin 支持 ESM 还是 CommonJS？

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

### @fluixi/vite-plugin 可以商用吗？

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

### @fluixi/vite-plugin 的下载量有多少？

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

### @fluixi/vite-plugin 还在维护吗？

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