You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
2.2 KiB
2.2 KiB
@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 - Automatich
injection syntactic sugarvModel
@vue/babel-sugar-v-model -vModel
syntactic sugarvOn
@vue/babel-sugar-v-on -vOn
syntactic sugar