Skip to content

Latest commit

 

History

History
49 lines (41 loc) · 838 Bytes

README.md

File metadata and controls

49 lines (41 loc) · 838 Bytes

vite-jsx

Help use directives such as v-if in the jsx of vite

Usage

Run npm install vite-jsx

or yarn add vite-jsx

Add to vite.config.js

import { createJsxPlugin } from "vite-jsx/plugin"

 module.exports = {
  plugins: [createJsxPlugin()],
  ...
}

Directives

  • v-if

  • v-else-if

  • v-else

  • v-show

  • v-text

  • v-html

  • v-model

    modifiers : sync, number, trim, lazy

    example : v-model_value = v-model:value

    v-model_trim_number = v-model.trim.number

IntelliSense

add to your *.d.ts

declare namespace JSX {
 interface IntrinsicAttributes {
   ['v-if']?: unknown
   ['v-else-if']?: unknown
   ['v-else']?: unknown
   ['v-show']?: unknown
   ['v-html']?: unknown
   ['v-text']?: unknown
   ['v-model']?: unknown
 }
}

TODO

  • performance optimization