Update vue monorepo
This MR contains the following updates:
Package | Type | Update | Change |
---|---|---|---|
@vue/compiler-sfc | devDependencies | patch | ^3.1.0 -> 3.2.37 |
vue | dependencies | patch | ^3.2.31 -> 3.2.37 |
vue-style-loader | devDependencies | patch | 4.1.2 -> 4.1.3 |
vue-template-compiler | dependencies | minor | 2.6.11 -> 2.7.8 |
Release Notes
vuejs/core
v3.2.37
Bug Fixes
- compiler-sfc: improve css v-bind parsing (e60244b), closes #6022
- runtime-core: hydrate Static vnode (#6015) (11e17a1), closes #6008
- sfc: avoid auto name inference leading to unwanted recursion (9734b31), closes #5965 #6027 #6029
- ssr: ensure app can be unmounted when created with createSSRApp() (#5992) (d4d3319), closes #5990
- ssr: hydration for transition wrapper components with empty slot content (#5995) (eb22a62), closes #5991
v3.2.36
Bug Fixes
- compat: fix app-level asset registration affecting other local apps (#5979) (7fb5732)
- compat: fix globalProperties pollution in v3 mode (2f07e34), closes #5699
- compiler-core: fix svg with directives being incorrectly hoisted (#5919) (7fbc933), closes #5289
-
sfc/types: allow use default factory for primitive types in
withDefaults
(#5939) (b546282), closes #5938 - transition: fix cancel leave regression (#5974) (dddbd96), closes #5973
Performance Improvements
v3.2.35
Bug Fixes
- compiler-sfc: fix usage detection for types in v-for/v-slot expressions (583b625), closes #5959
-
types: fix typescript error when spreading
$props
(#5968) (0c7fd13) - types: restore DefineComponent argument order (8071ef4), closes #5416 #3796 #5967
v3.2.34
Bug Fixes
- compiler-core: should generate HYDRATE_EVENTS flag on dynamic component that resolves to element (415091b), closes #5870
-
compiler-sfc: support
export { default } from '...'
(#5937) (73e6523), closes #5935 - compiler-sfc: type-only defineProps does not recognize Promise (fix #5941) (#5943) (991d623)
- compiler-ssr: fix component event handlers inheritance in ssr (f811dc2), closes #5664
- compiler-ssr: fix wrong attrs fallthrough on non-single-root v-if branches (516bc54), closes #5140
- compiler-ssr: only inject fallthrough attrs for root transition/keep-alive (c65b805)
- keep-alive: fix keep-alive rendering when placed in vnode branch (0841b9b), closes #4817
- runtime-core: adjust force diff of dev root fragments (cdda49b), closes #5946
- ssr/teleport: support nested teleports in ssr (595263c), closes #5242
- ssr: fix hydration error on falsy v-if inside transition/keep-alive (ee4186e), closes #5352
- ssr: fix hydration error when teleport is used as component root (b60cff0), closes #4293
- ssr: fix hydration error when transition contains comment children (3705b3b), closes #5351
- ssr: fix hydration for slot with empty text node (939209c), closes #5728
- ssr: fix hydration mismatch caused by multi-line comments inside slot (e1bc268), closes #5355
- ssr: inherit scope id on functional component during ssr (847d7f7), closes #5817
- ssr: render fallthrough attributes for transition-group with tag (aed10c5), closes #5141
- ssr: support client-compiled v-model with dynamic type during ssr (#5787) (c03459b), closes #5786
- types: export ComponentProvideOptions (#5947) (3e2850f)
-
types: fix
defineComponent
inference toComponent
(#5949) (7c8f457)
v3.2.33
Bug Fixes
- compat: copy additional properties for functions bound via globalProperties (#4873) (1612971), closes #4403
- compiler-sfc: handle type modifier in import specifiers (#5498) (8e29ef6)
- custom-elements: work with async component + slots (#4657) (f4d2c9f), closes #4639
- reactivity-transform: should not rewrite catch param (#5711) (1f14f19), closes #5709
- reactivity: fix ref tracking of self-stopping effects (154233a), closes #5707
- runtime-core: ensure custom events are not emitted anymore after unmount. (#5679) (71c9536), closes #5674
- runtime-core: fix use of non-existent-in-prod internal property in defineProperty trap (f641c4b), closes #5710
- runtime-dom: catch more cases of DOM property setting error (#5552) (fa1d14c), closes #5545
- runtime-dom: patch translate as an attr (#5485) (2c09969), closes #5462
- runtime-dom: properly handle style properties with undefined values (#5348) (85af139), closes #5322
- ssr: avoid rendering reserved internal keys in output (#5564) (cc238cd), closes #5563
- transition: fix broken leave transition on dev root fragment (#5268) (767d212)
- transition: handle transition for v-if branches with comment (62eba63), closes #5675
v3.2.32
Bug Fixes
- devtools: perf: use high-resolution time (1070f12)
- reactivity: fix currentScope loss when running detached effect scope (#5575) (0a301d4)
- runtime-core/template-ref: named ref in v-for regression fix (#5118) (cee1eaf), closes #5116 #5447 #5525
- runtime-core: allow spying on proxy methods regression (#5417) (1574edd), closes #5415 #4216
- runtime-core: Avoid mutating original options object in createApp (#4840) (d121a9b), closes #4398
- runtime-core: ensure custom directive instance properly exposes properties on closed instances. (#5022) (f44087e), closes #5018
- runtime-core: fix event listener as dynamicProp is added erroneously to props (#5517) (8eceabd), closes #5520
- transition: ensure flattened transition group children inherit parent keys (4311ddd), closes #4718 #5360 #5392
vuejs/vue
v2.7.8
Bug Fixes
- reactivity: fix shallowReactive nested ref setting edge cases (2af751b), closes #12688
-
sfc: align
<script setup>
component resolution edge case with v3 (#12687) (a695c5a), closes #12685 - types: avoid circular type inference between v2 and v3 instance types (fabc1cf), closes #12683
-
types: export
defineAsyncComponent
type (#12684) (ba7dd2c)
Features
-
setup: support listeners on setup context +
useListeners()
helper (adf3ac8)
v2.7.7
Bug Fixes
- codegen: script setup should not attempt to resolve native elements as component (e8d3a7d), closes #12674
- inject: fix edge case of provided with async-mutated getters (ea5d0f3), closes #12667
- setup: ensure setup context slots can be accessed immediately (67760f8), closes #12672
- types: vue.d.ts should use relative import to v3-component-public-instance (#12668) (46ec648), closes #12666
- watch: fix queueing multiple post watchers (25ffdb6), closes #12664
v2.7.6
Bug Fixes
- types: $refs can also contain ComponentPublicInstance (#12659) (fffbb9e)
- types: fix $children and $root instance types (52a5979), closes #12655
- types: fix missing expose() type on setup context (e0a9546), closes #12660
v2.7.5
Bug Fixes
- add missing export from
vue.runtime.mjs
(#12648) (08fb4a2) - detect property add/deletion on reactive objects from setup when used in templates (a6e7498)
- do not set currentInstance in beforeCreate (0825d30), closes #12636
- reactivity: fix watch behavior inconsistency + deep ref shallow check (98fb01c), closes #12643
- sfc: fix sfc name inference type check (04b4703), closes #12637
- types: support Vue interface augmentations in defineComponent (005e52d), closes #12642
- watch: fix deep watch for structures containing raw refs (1a2c3c2), closes #12652
v2.7.4
Bug Fixes
- build: fix mjs dual package hazard (012e10c), closes #12626
- compiler-sfc: use safer deindent default for compatibility with previous behavior (b70a258)
- pass element creation helper to static render fns for functional components (dc8a68e), closes #12625
- ssr/reactivity: fix array setting error at created in ssr [#12632] (#12633) (ca7daef)
- types: fix missing instance properties on defineComponent this (f8de4ca), closes #12628
- types: fix this.$slots type for defineComponent (d3add06)
- types: fix type inference when using components option (1d5a411)
- types: global component registration type compat w/ defineComponent (26ff4bc), closes #12622
- watch: fix watchers triggered in mounted hook (8904ca7), closes #12624
Features
- defineAsyncComponent (9d12106), closes #12608
- support functional components in defineComponent (559600f), closes #12619
v2.7.3
Bug Fixes
- add renderTracked/Triggered merge strategy (#12616) (6d1dbee)
- ssr/reactivity: fix composition api behavior in SSR (360272b), closes #12615
- types: allow slot attribute (94ccca2), closes #12617
v2.7.2
Bug Fixes
Features
- allow passing directive definition directly to h() (#12590) (d45bbea)
- types: define component improvements (#12612) (fb93c1b)
v2.7.1
Bug Fixes
- compiler-sfc: fix template usage check edge case for v-on statements (caceece), closes #12591
- export proxyRefs (e452e9d), closes #12600
- fix NaN comparison on state change (ff5acb1), closes #12595
- reactivity: shallowReactive should not unwrap refs (#12605) (15b9b9b), closes #12597
v2.7.0
Backported Features
- Composition API
- SFC
<script setup>
- SFC CSS v-bind
In addition, the following APIs are also supported:
-
defineComponent()
with improved type inference (compared toVue.extend
) -
h()
,useSlot()
,useAttrs()
,useCssModules()
-
set()
,del()
andnextTick()
are also provided as named exports in ESM builds. -
The
emits
option is also supported, but only for type-checking purposes (does not affect runtime behavior)2.7 also supports using ESNext syntax in template expressions. When using a build system, the compiled template render function will go through the same loaders / plugins configured for normal JavaScript. This means if you have configured Babel for
.js
files, it will also apply to the expressions in your SFC templates.
Notes on API exposure
-
In ESM builds, these APIs are provided as named exports (and named exports only):
import Vue, { ref } from 'vue' Vue.ref // undefined, use named export instead
-
In UMD and CJS builds, these APIs are exposed as properties on the global
Vue
object. -
When bundling with CJS builds externalized, bundlers should be able to handle ESM interop when externalizing CJS builds.
Behavior Differences from Vue 3
The Composition API is backported using Vue 2's getter/setter-based reactivity system to ensure browser compatibility. This means there are some important behavior differences from Vue 3's proxy-based system:
-
All Vue 2 change detection caveats still apply.
-
reactive()
,ref()
, andshallowReactive()
will directly convert original objects instead of creating proxies. This means:// true in 2.7, false in 3.x reactive(foo) === foo
-
readonly()
does create a separate object, but it won't track newly added properties and does not work on arrays. -
Avoid using arrays as root values in
reactive()
because without property access the array's mutation won't be tracked (this will result in a warning). -
Reactivity APIs ignore properties with symbol keys.
In addition, the following features are explicitly NOT ported:
-
❌ createApp()
(Vue 2 doesn't have isolated app scope) -
❌ Top-levelawait
in<script setup>
(Vue 2 does not support async component initialization) -
❌ TypeScript syntax in template expressions (incompatible w/ Vue 2 parser) -
❌ Reactivity transform (still experimental) -
❌ expose
option is not supported for options components (butdefineExpose()
is supported in<script setup>
).
TypeScript Changes
-
defineComponent
provides improved type inference similar to that of Vue 3. Note the type ofthis
insidedefineComponent()
is not interoperable withthis
fromVue.extend()
. -
Similar to Vue 3, TSX support is now built-in. If your project previously had manual JSX type shims, make sure to remove them.
Upgrade Guide
Vue CLI / webpack
-
Upgrade local
@vue/cli-xxx
dependencies the latest version in your major version range (if applicable):-
~4.5.18
for v4 -
~5.0.6
for v5
-
-
Upgrade
vue
to^2.7.0
. You can also removevue-template-compiler
from the dependencies - it is no longer needed in 2.7.Note: if you are using
@vue/test-utils
, you may need to keep it in the dependencies for now, but this requirement will also be lifted in a new release of test utils. -
Check your package manager lockfile to ensure the following dependencies meet the version requirements. They may be transitive dependencies not listed in
package.json
.-
vue-loader
:^15.10.0
-
vue-demi
:^0.13.1
If not, you will need to remove
node_modules
and the lockfile and perform a fresh install to ensure they are bumped to the latest version. -
-
If you were previously using
@vue/composition-api
, update imports from it tovue
instead. Note that some APIs exported by the plugin, e.g.createApp
, are not ported in 2.7. -
Update
eslint-plugin-vue
to latest version (9+) if you run into unused variable lint errors when using<script setup>
. -
The SFC compiler for 2.7 now uses PostCSS 8 (upgraded from 7). PostCSS 8 should be backwards compatible with most plugins, but the upgrade may cause issues if you were previously using a custom PostCSS plugin that can only work with PostCSS 7. In such cases, you will need to upgrade the relevant plugins to their PostCSS 8 compatible versions.
Vite
2.7 support for Vite is provided via a new plugin: @vitejs/plugin-vue2. This new plugin requires Vue 2.7 or above and supersedes the existing vite-plugin-vue2.
Note that the new plugin does not handle Vue-specific JSX / TSX transform, which is intentional. Vue 2 JSX / TSX transform should be handled in a separate, dedicated plugin, which will be provided soon.
Volar Compatibility
2.7 ships improved type definitions so it is no longer necessary to install @vue/runtime-dom
just for Volar template type inference support. All you need now is the following config in tsconfig.json
:
{
// ...
"vueCompilerOptions": {
"target": 2.7
}
}
Devtools Support
Vue Devtools 6.2.0 has added support for inspecting 2.7 Composition API state, but the extensions may still need a few days to go through review on respective publishing platforms.
Bug Fixes
- sfc: only include legacy decorator parser plugin when new plugin is not used (326d24a)
v2.6.14
Bug Fixes
- types: async Component types (#11906) (c52427b)
- v-slot: fix scoped slot normalization combined with v-if (#12104) (38f71de)
Features
v2.6.13
Bug Fixes
- attrs: do not consider translate attribute as boolean (#11392) (cd57393), closes #11391
- compiler: Allow BigInt usage in templates (#11152) (c42b706)
- compiler: avoid converting &nbps; to spaces (#11065) (55a30cf)
- compiler: event handlers with modifiers swallowing arguments (fix #10867) (#10958) (8620706)
- core: fix sameVnode for async component (#11107) (5260830)
- core: remove trailing comma in function signature (#10845) (579e1ff), closes #10843
- errorHandler: async error handling for watchers (#9484) (e4dea59)
- force update between two components with and without slot (#11795) (77b5330)
- give correct namespace in foreignObject (#11576) (af5e05d), closes #11575
- handle async placeholders in normalizeScopedSlot (#11963) (af54514)
- keep-alive: cache what is really needed not the whole VNode data (#12015) (e7baaa1)
- parser: allow multiple slots with new syntax (#9785) (67825c2), closes #9781
- pause dep collection during immediate watcher invocation (#11943) (987f322)
- props: correctly warn when a provided prop is Symbol (#10529) (abb5ef3), closes #10519
- props: support BigInt in props type validation (#11191) (fa1f81e)
- slot: add a function to return the slot fallback content (#12014) (ce457f9)
- ssr: avoid missing files in manifest (#11609) (b97606c)
- ssr: inheritAttrs false adds attributes to html (#11706) (7e5dc6b)
- ssr: textarea keeps undefined/null values (#11121) (b8bd149)
- types: add types for Vue.util.warn function (#11964) (e0274e4), closes /github.com/vuejs/vue/blob/v2.6.12/src/core/util/debug.js#L18-L26
- types: allow string for watch handlers in options (#10396) (668e1e6)
- types: allow symbol & boolean for vnode key (#11914) (5c459f0)
- types: changed expression type to optional string (#11189) (7c75462), closes #10871
- types: make $refs undefined possible (#11112) (2b93e86)
- v-on: avoid events with empty keyCode (autocomplete) (#11326) (c6d7a6f)
- v-pre: do not alter attributes (#10088) (0664cb0), closes #10087
- vdom: avoid executing root level script tags (#11487) (fb16d7b), closes #11483
- warn: better message with no constructors props (#9241) (6940131)
-
warns: modify
maybeComponent
function in parser (#10167) (0603ff6), closes #10152
Features
- warns: avoid warning native modifiers on dynamic components (#11052) (3d46692)
- warn: warn computed conflict with methods (#10119) (3ad60fe)
Performance Improvements
v2.6.12
Bug Fixes
Configuration
-
If you want to rebase/retry this MR, click this checkbox.
This MR has been generated by Renovate Bot.