Skip to main content
FarmFarm
Version: 2.x (Latest)
On this page

@farmfe/plugin-vue-jsx

Transform Vue JSX/TSX at build time — converts directives (v-model, v-show, etc.) into Vue 3 runtime calls. Written in Rust with zero JS overhead.

This plugin is the Farm-native equivalent of @vitejs/plugin-vue-jsx, ported from swc-plugin-vue-jsx.

Installation

javascript
npm install @farmfe/plugin-vue-jsx
javascript
yarn add @farmfe/plugin-vue-jsx
javascript
pnpm add @farmfe/plugin-vue-jsx

Usage

ts
import { defineConfig } from "@farmfe/core";
import vueJsx from "@farmfe/plugin-vue-jsx";

export default defineConfig({
  plugins: [vueJsx()],
});

With options:

ts
export default defineConfig({
  plugins: [
    vueJsx({
      optimize: true,
      transformOn: true,
      resolveType: true,
    }),
  ],
});

Options

OptionTypeDefaultDescription
transformOnbooleanfalseConvert on / nativeOn attrs via @vue/babel-helper-vue-transform-on
optimizebooleanfalseInject Vue PatchFlags for optimized VNode updates
customElementPatternsstring[][]Regex patterns for custom element tags
mergePropsbooleantrueMerge attribute objects with Vue's mergeProps
enableObjectSlotsbooleantrueEnable object slot detection
pragmastringundefinedCustom pragma (e.g. h), overrides createVNode
resolveTypebooleanfalseResolve TypeScript types for defineComponent props/emits

transformOn

When enabled, on and nativeOn attributes are converted using @vue/babel-helper-vue-transform-on. You must install this package in your project:

bash
pnpm add @vue/babel-helper-vue-transform-on
100%

Drag or pinch to explore. Keyboard: + / − zoom, arrows pan, 0 resets, Esc closes.