| 
				
					
						 | 
			||
|---|---|---|
| .. | ||
| dist | ||
| README.md | ||
| package.json | ||
		
			
				
				README.md
			
		
		
			
			
		
	
	@vue/babel-preset-jsx
Configurable preset for Vue JSX plugins.
Babel Compatibility Notes
- This repo is only compatible with Babel 7.x, for 6.x please use vuejs/babel-plugin-transform-vue-jsx
 
Usage
Install the dependencies:
# for yarn:
yarn add @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props
# for npm:
npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props --save
In your babel.config.js:
module.exports = {
  presets: ['@vue/babel-preset-jsx'],
}
You can toggle specific features, by default all features (except compositionAPI) are enabled, e.g.:
module.exports = {
  presets: [
    [
      '@vue/babel-preset-jsx',
      {
        vModel: false,
        compositionAPI: true,
      },
    ],
  ],
}
Options are:
compositionAPI- Enables @vue/babel-sugar-composition-api-inject-h and @vue/babel-sugar-composition-api-render-instance, support returning render function insetup.- The default value is 
false; - When set to 
'auto'(ortrue), it will detect the Vue version in the project. If it's >= 2.7, it will import the composition utilities fromvue, otherwise from@vue/composition-api; - When set to 
'native'(or'naruto'), it will always import the composition utilities fromvue - When set to 
plugin, it will always import the composition utilities from@vue/composition-api, but it will redirect to'vue'itself when the vue version is2.7.x - When set to 
vue-demi, it will always import the composition utilities fromvue-demi - When set to an object like 
{ importSource: string; }, it will always import the composition utilities from the importSource you set 
- The default value is 
 functional@vue/babel-sugar-functional-vue - Functional components syntactic sugarinjectH@vue/babel-sugar-inject-h - Automatichinjection syntactic sugarvModel@vue/babel-sugar-v-model -vModelsyntactic sugarvOn@vue/babel-sugar-v-on -vOnsyntactic sugar