Changelog History
Page 2
-
v2.7.4 Changes
July 08, 2022🐛 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
-
v2.7.1 Changes
July 04, 2022 -
v2.7.0 Changes
July 01, 2022Backported 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-level
await
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
⬆️ 1. 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
⬆️ 2. 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.📦 3. 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.⚡️ 4. 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.⚡️ 5. 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 intsconfig.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.7.0-beta.8 Changes
June 28, 2022🐛 Bug Fixes
- compiler-sfc: should transform non relative paths when base option is present (008d78b)
-
v2.7.0-beta.7 Changes
June 27, 2022 -
v2.7.0-beta.6 Changes
June 26, 2022 -
v2.7.0-beta.5 Changes
June 22, 2022 -
v2.7.0-beta.4 Changes
June 21, 2022