New: your coding agent can read the release notes before it upgrades. Set up the MCP server →
Babel syntactic sugar for v-model support in Vue JSX
Last release 4 years ago
no release in 18 months
Release timing varies
gaps range from 2 weeks to 1.7 years
Most releases are documented
notes for 8 of 9 stable releases
Nothing withdrawn
no release was ever pulled
8 years old
12 releases · first in 2018
If you need to use vue-demi to support both Vue <= 2.6 and Vue 2.7, you can now set the compositionAPI option to 'vue-demi' .
@vue/babel-preset-jsx
vue-demi to support both Vue <= 2.6 and Vue 2.7, you can now set the compositionAPI option to 'vue-demi'.compositionAPI option now also accepts an object { importSource: 'package-name' } to allow further customization.Composition API support (originally added in v1.2.1 ) now works with Vue 2.7 "Naruto" .
One column per quarter.
Composition API support (originally added in v1.2.1) now works with Vue 2.7 "Naruto".
If you've already used it in projects with @vue/composition-api, no additional configuration is required.
We'll automatically switch to the built-in methods in vue if Vue.js >= 2.7 is detected.
You can also have finer control over this behavior, see the preset README for more options.
This feature is opt-in, because there are subtle differences between the global h function and this.$createElement1, which may affect some legacy codebases.
It's safe to use it in new projects, though.
To enable this feature, turn on the compositionAPI flag in @vue/babel-preset-jsx:
// babel.config.js
module.exports = {
presets: [
[
"@vue/babel-preset-jsx",
{
compositionAPI: true,
},
],
],
};If you are using the preset provided by Vue CLI, the flag is a subfield of the jsx option:
// babel.config.js
module.exports = {
presets: [
[
"@vue/cli-plugin-babel/preset",
{
jsx: {
compositionAPI: true,
},
},
],
],
};When the compositionAPI flag is on, we prefer the global h over this.$createElement.
The global h requires currentInstance to be present when executing.
In some legacy codebases, a standalone render function might rely on its this context rather than the runtime currentInstance. So there may be incompatibilities.
If you encounter such issues after turning the flag on, you can manually add const h = this.$createElement to the beginning of the problematic function. The JSX plugin won't override your explicitly defined h. ↩
v-model/v-on should apply before arrow-functions transform ( #167 ) ( 319932e ), closes #87 /github.com/vuejs/jsx/issues/165#issuecomment-712603569
Added @vue/composition-api support, thanks to @luwanquan and @antfu .
Added @vue/composition-api support, thanks to @luwanquan and @antfu.
To enable this feature, turn on the compositionAPI flag in @vue/babel-preset-jsx:
// babel.config.js
module.exports = {
presets: [
[
"@vue/babel-preset-jsx",
{
compositionAPI: true,
},
],
],
};If you are using the preset provided by Vue CLI, the flag is a subfield of the jsx option:
// babel.config.js
module.exports = {
presets: [
[
"@vue/cli-plugin-babel/preset",
{
jsx: {
compositionAPI: true,
},
},
],
],
};@vue/babel-plugin-transform-vue-jsx , @vue/babel-preset-jsx , @vue/babel-sugar-functional-vue , @vue/babel-sugar-inject-h , @vue/babel-sugar-v-model ,
@vue/babel-plugin-transform-vue-jsx, @vue/babel-preset-jsx, @vue/babel-sugar-functional-vue, @vue/babel-sugar-inject-h, @vue/babel-sugar-v-model, @vue/babel-sugar-v-on:
@babel/core to peerDependencies, as it's required by @babel/plugin-syntax-jsx@vue/babel-preset-jsx , @vue/babel-sugar-v-model :
@vue/babel-preset-jsx, @vue/babel-sugar-v-model:
Support props with underscore, close #55
filter out jsx comments in getChildren (7f0c84c), closes #46
Add events at the begining of argument list
Nothing published for this version
Your coding agent can read these notes before it upgrades. Set up the MCP server →