1. @vue/babel-sugar-composition-api-inject-h
Babel syntactic sugar for h automatic injection for Vue JSX with @vue/composition-api
@vue/babel-sugar-composition-api-inject-h
Package: @vue/babel-sugar-composition-api-inject-h
Created by: vuejs
Last modified: Thu, 22 Jun 2023 12:00:38 GMT
Version: 1.4.0
License: MIT
Downloads: 3,334,724
Repository: https://github.com/vuejs/jsx

Install

npm install @vue/babel-sugar-composition-api-inject-h
yarn add @vue/babel-sugar-composition-api-inject-h

@vue/babel-sugar-composition-api-inject-h

Ported from luwanquan/babel-preset-vca-jsx by @luwanquan

Syntactic sugar for automatic h inject in JSX with @vue/composition-api.

Babel Compatibility Notes

  • This repo is only compatible with Babel 7.x

Usage

Install the dependencies:

 # for yarn:
yarn add @vue/babel-sugar-composition-api-inject-h
# for npm:
npm install @vue/babel-sugar-composition-api-inject-h --save

In your .babelrc:

 {
  "plugins": ["@vue/babel-sugar-composition-api-inject-h"]
}

However it is recommended to use the configurable preset instead.

Details

This plugin automatically injects h in every method that has JSX. By using this plugin you don't have to always import h from @vue/composition-api.

 // Without @vue/babel-sugar-inject-h
import { h } from '@vue/composition-api'

export default {
  setup() {
    return () => <button />
  },
}
 // With @vue/babel-sugar-inject-h
export default {
  setup() {
    return () => <button />
  },
}

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code