Vue Updates
114 subscribers
695 photos
842 links
Channel for automatic notifications about updates in the Vue ecosystem.

Watching: vue, nuxt, vuetify, vue-i18n-next, vue-router, pinia and vite

Contacts: @Black_Yuzia

Our channels:
@Vue_Courses
@Vue_Updates
@frontendmasters_courses
Download Telegram
Vuetify
v3.5.0

#vuetify

v3.5.0 (Polaris)

Welcome to the v3.5.0 release of Vuetify!

----------------------

๐Ÿ’ช Support Vuetify Development

Vuetify is an open source MIT project that has been made possible due to the generous contributions by our sponsors and backers. If you are interested in supporting this project, please consider:

โ— Requesting Enterprise Support
โ— Sponsoring John on Github
โ— Sponsoring Kael on Github
โ— Supporting the team on Open Collective
โ— Becoming a sponsor on Patreon
โ— Becoming a subscriber on Tidelift
โ— Making a one-time donation with Paypal

๐Ÿ“– Table of Contents

โ— #Release Introduction
โ— #Important Links
โ— #Upgrade Guide
โ— #Release Notes

โ—๏ธ Important Links

โ— ๐Ÿ“„ Docs
โ— ๐Ÿšจ Issues
โ— ๐Ÿฌ Store
โ— ๐ŸŽฎ Play
โ— ๐Ÿ’ฌ Discord
โ— ๐Ÿ—‘๏ธ Bins

๐Ÿ“‘ Upgrade guide

โ— VCardItem append/prepend icon/avatar will now show independently and have reduced inline padding. This brings the component more in line with how VListItem works.

๐Ÿ’ฏ Release notes

๐Ÿš€ Features
๐Ÿ—ฟ1
Vue Updates
Vuetify v3.5.0 #vuetify v3.5.0 (Polaris) Welcome to the v3.5.0 release of Vuetify! ---------------------- ๐Ÿ’ช Support Vuetify Development Vuetify is an open source MIT project that has been made possible due to the generous contributions by our sponsorsโ€ฆ
โ— goTo: port to v3 (#19046) (4eeae8c), closes #5732 #13538
โ— locale: add khmer translations (#18695) (e1d0e03)
โ— style: add cursor class utilities (#17033) (a25aac9)
โ— theme: add surface-light color (#19047) (d20875a), closes #18091
โ— VAutocomplete/VCombobox: add new clearOnSelect prop (657d929), closes #6842
โ— VCardItem: bring in-line with VListItem functionality (356bfd1)
โ— VDataTable/Virtual: add support for sorting raw objects (#19048) (0bba2f5), closes #11226
โ— VDatePicker: add new multiple prop options (07781b3), closes #18701
โ— VFileInput: add string support for showSize prop (706565f)
โ— VImg: add rounded and color support (32ac0a1)
โ— VList: add expand / collapse icon support (8414baf)
โ— VSelects: add new listProps prop (1f7b403), closes #6458
โ— VSwitch: add thumb, track-true, and track-false slots (#18092) (7031faa)

๐Ÿ”ง Bug Fixes

โ— VChipGroup: use VSlideGroup as baseline component (#17911) (bcffca9), closes #17321
โ— VDataTable: add new headerProps prop (#19025) (d121f54), closes #18993
โ— VDataTableVirtual: add missing colgroup slot (#19052) (0dca210)
Vuetify
v3.5.1

#vuetify

๐Ÿ”ง Bug Fixes

โ— VChipGroup: correctly filter props (54054d8)

Other Commmits

โ— chore(release): publish v3.5.1 (7afd453)
Vite
v5.1.0-beta.3

#vite

5.1.0-beta.3 (2024-01-22)

โ— perf: middleware to short-circuit on 304 (#15586) (35ae4f8), closes #15586

โ— perf: use thread for preprocessors (#13584) (acd795f), closes #13584

โ— fix: default sideEffect option is delivered to rollup (#15665) (f6cf3d1), closes #15665

โ— fix(ssr): mark builtin modules as side effect free (#15658) (526cf23), closes #15658

โ— fix(ssr): support externalized builtins for webworker (#15656) (639bbd6), closes #15656

โ— refactor: append tags logic in applyHtmlTransforms (#15647) (09b1517), closes #15647

โ— refactor(hmr): provide a separate logger interface (#15631) (110e2e1), closes #15631
Quasar
quasar-v2.14.3

#quasar

Fixes

โ— Vue 3.4 --> fix(ui): Hydration issues with Vue 3.4 (QField/QInput/..., QBtnDropdown, QExpansionItem, QFab) #16792
โ— Vue 3.4 --> fix(Dark): [Vue 3.4] Hydration issue with Dark Quasar plugin on SSR #16818
โ— fix(QAjaxBar): fix infinite fetch loop in watchEffect #16767 (#16780)
โ— fix(ui): expose updateScrollTarget method for QInfiniteScroll (#16182)
โ— fix(QTab): softError.message is undefined when opening tab with control-key #16791
โ— fix(QField/QInput/...): lazy validation breaks when clearable button is clicked #16723

Donations

Quasar Framework is an open-source MIT-licensed project made possible due to the generous contributions by sponsors and backers. If you are interested in supporting this project, please consider the following:

โ— Becoming a sponsor on Github
โ— One-off donation via PayPal
Vite
[email protected]

#vite

5.3.0 (2024-01-25)

โ— docs: fix commit id collision (#15105) (0654d1b), closes #15105

โ— docs: fix dead link (#15700) (aa7916a), closes #15700

โ— feat(legacy): build file name optimization (#15115) (39f435d), closes #15115

โ— feat(legacy): support any separator before hash in fileNames (#15170) (ecab41a), closes #15170

โ— feat(plugin-legacy): add modernTargets option (#15506) (cf56507), closes #15506

โ— fix(deps): update all non-major dependencies (#15233) (ad3adda), closes #15233

โ— fix(deps): update all non-major dependencies (#15304) (bb07f60), closes #15304

โ— fix(deps): update all non-major dependencies (#15375) (ab56227), closes #15375

โ— chore(deps): update all non-major dependencies (#15145) (7ff2c0a), closes #15145
Vite
v5.1.0-beta.4

#vite

5.1.0-beta.4 (2024-01-26)

โ— perf: lazy load rollup during dev (#15621) (6f88a90), closes #15621

โ— perf: use workspace root for fs cache (#15712) (8815763), closes #15712

โ— chore: remove unneeded normalizePath (#15713) (92f2747), closes #15713

โ— chore(proxy): update proxy error info (#15678) (09bd58d), closes #15678

โ— feat: enable fs.cachedChecks by default (#15704) (a05c709), closes #15704

โ— feat(optimizer): holdUntilCrawlEnd option (#15244) (b7c6629), closes #15244

โ— fix: normalize prettify url (#15705) (98bc3dc), closes #15705

โ— fix: windows add/delete file (3a7b650)

โ— fix(build): build error message output twice (#15664) (74382b9), closes #15664

โ— fix(hmr): pass id in parseImports for better debugging DX (#15707) (fb4bddc), closes #15707

โ— fix(node): remove timestamp query of staticImportedUrls (#15663) (6c4bf26), closes #15663

โ— fix(preview): set isPreview true (#15695) (93fce55), closes #15695
Vite
v5.1.0-beta.5

#vite

5.1.0-beta.5 (2024-01-27)

โ— fix: do not init optimizer during build (#15727) (a08f646), closes #15727

โ— fix(deps): update all non-major dependencies (#15675) (4d9363a), closes #15675
NuxtJS
v3.10.0

#nuxt3.10.0 is the next minor/feature release.

๐Ÿ‘€ Highlights

v3.10 comes quite close on the heels of v3.9, but it's packed with features and fixes. Here are a few highlights.

โœจ Experimental shared asyncData when prerendering

When prerendering routes, we can end up refetching the same data over and over again. In Nuxt 2 it was possible to create a 'payload' which could be fetched once and then accessed in every page (and this is of course possible to do manually in Nuxt 3 - see this article).

With #24894, we are now able to do this automatically for you when prerendering. Your useAsyncData and useFetch calls will be deduplicated and cached between renders of your site.
export defineNuxtConfig({
experimental: {
sharedPrerenderData: true
}
})

Important
Vue Updates
NuxtJS v3.10.0 #nuxt3.10.0 is the next minor/feature release. ๐Ÿ‘€ Highlights v3.10 comes quite close on the heels of v3.9, but it's packed with features and fixes. Here are a few highlights. โœจ Experimental shared asyncData when prerendering When prerenderingโ€ฆ
It is particularly important to make sure that any unique key of your data is always resolvable to the same data. For example, if you are using useAsyncData to fetch data related to a particular page, you should provide a key that uniquely matches that data. (useFetch should do this automatically.)

๐Ÿ‘‰ See full documentation.

๐Ÿ†” SSR-safe accessible unique ID creation

We now ship a useId composable for generating SSR-safe unique IDs (#23368). This allows creating more accessible interfaces in your app. For example:
">
<script setup>
const emailId = useId()
const passwordId = useId()
>script>

<template>
<form>
<label :for="emailId">Email>label>
<input
:id="emailId"
name="email"
type="email"
>
<label :for="passwordId">Password>label>
<input
:id="passwordId"
name="password"
type="password"
>
>form>
>template>


โœ๏ธ Extending app/router.options

It's now possible for module authors to inject their own router.options files (#24922). The new pages:routerOptions hook allows module authors to do things like add custom scrollBehavior or add runtime augmenting of routes.

๐Ÿ‘‰ See full documentation.

Client-side Node.js support

We now support (experimentally) polyfilling key Node.js built-ins (#25028), just as we already do via Nitro on the server when deploying to non-Node environments.

That means that, within your client-side code, you can import directly from Node built-ins (node: and node imports are supported). However, nothing is globally injected for you, to avoid increasing your bundle size unnecessarily. You can either import them where needed.
import { Buffer } from 'node:buffer'
import process from 'node:process'

Or provide your own polyfill, for example, inside a Nuxt plugin.
// ~/plugins/node.client.ts
import { Buffer } from 'node:buffer'
import process from 'node:process'

globalThis.Buffer = Buffer
globalThis.process = process

export default defineNuxtPlugin({})

This should make life easier for users who are working with libraries without proper browser support. However, because of the risk in increasing your bundle unnecessarily, we would strongly urge users to choose other alternatives if at all possible.

๐Ÿช Better cookie reactivity

We now allow you to opt-in to using the CookieStore. If browser support is present, this will then be used instead of a BroadcastChannel to update useCookie values reactively when the cookies are updated (#25198).

This also comes paired with a new composable, refreshCookie which allows manually refreshing cookie values, such as after performing a request. See full documentation.

๐Ÿฅ Detecting anti-patterns

In this release, we've also shipped a range of features to detect potential bugs and performance problems.

โ— We now will throw an error if setInterval is used on server (#25259).
โ— We warn (in development only) if data fetch composables are used wrongly (#25071), such as outside of a plugin or setup context.
โ— We warn (in development only) if you are not using but have the vue-router integration enabled (#25490). ( should not be used on its own.)

๐Ÿง‚ Granular view transitions support

It's now possible to control view transitions support on a per-page basis, using definePageMeta (#25264).

You need to have experimental view transitions support enabled first:
export default defineNuxtConfig({
experimental: {
viewTransition: true
},
app: {
// you can disable them globally if necessary (they are enabled by default)
viewTransition: false
}
})

And you can opt in/out granularly:
definePageMeta({ viewTransition: false }) ">
// ~/pages/index.vue
<script setup lang="ts">
definePageMeta({
viewTransition: false
})
script>

Finally, Nuxt will not apply View Transitions if the user's browser matches prefers-reduced-motion: reduce (#22292). You can set viewTransition: 'always'; it will then be up to you to respect the user's preference.

๐Ÿ—๏ธ Build-time route metadata
Vue Updates
It is particularly important to make sure that any unique key of your data is always resolvable to the same data. For example, if you are using useAsyncData to fetch data related to a particular page, you should provide a key that uniquely matches that data.โ€ฆ
It's now possible to access routing metadata defined in definePageMeta at build-time, allowing modules and hooks to modify and change these values (#25210).
export default defineNuxtConfig({
experimental: {
scanPageMeta: true
}
})

Please, experiment with this and let us know how it works for you. We hope to improve performance and enable this by default in a future release so modules like @nuxtjs/i18n and others can provide a deeper integration with routing options set in definePageMeta.

๐Ÿ“ฆ Bundler module resolution

With #24837, we are now opting in to the TypeScript bundler resolution which should more closely resemble the actual way that we resolve subpath imports for modules in Nuxt projects.

'Bundler' module resolution is recommended by Vue and by Vite, but unfortunately there are still many packages that do not have the correct entries in their package.json.

As part of this, we opened 85 PRs across the ecosystem to test switching the default, and identified and fixed some issues.

If you need to switch off this behaviour, you can do so. However, please consider raising an issue (feel free to tag me in it) in the library or module's repo so it can be resolved at source.
export default defineNuxtConfig({
future: {
typescriptBundlerResolution: false
}
})


โœ… Upgrading

As usual, our recommendation for upgrading is to run:
nuxi upgrade --force

This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the unjs ecosystem.

-->

๐Ÿ‘‰ Changelog

compare changes

๐Ÿš€ Enhancements

โ— nuxt: tryUseNuxtApp composable (#25031)
โ— nuxt: Add experimental sharedPrerenderData option (#24894)
โ— schema: Default to bundler module resolution (#24837)
โ— nuxt: Warn if data fetch composables are used wrongly (#25071)
โ— nuxt: Add pages:routerOptions hook (#24922)
โ— Experimental client-side Node.js compatibility (#25028)
โ— nuxt: Throw error if setInterval is used on server (#25259)
โ— nuxt: refreshCookie + experimental CookieStore support (#25198)
โ— nuxt: Allow controlling view transitions in page meta (#25264)
โ— nuxt: Slow down loading indicator when approaching 100% (#25119)
โ— nuxt: Experimentally extract route metadata at build time (#25210)
โ— nuxt: useId composable (#23368)

๐Ÿ”ฅ Performance

โ— vite: Avoid endsWith when checking for whitespace (#24746)

๐Ÿฉน Fixes

โ— nuxt: Disable View Transitions if prefers-reduced-motion (#22292)
โ— nuxt: Add declaration file with correct node16 imports (#25266)
โ— nuxt: Allow omitting fallback in island response (#25296)
โ— schema: Remove defineModel option as it is now stable (#25306)
โ— nuxt: Overwrite island payload instead of merging (#25299)
โ— vite: Pass hidden sourcemap values to vite (#25329)
โ— nuxt: ...
This is fine.
I will try fix it. In my configuration this should create a post on telegra.ph by length limit.
Idk why this isn't work ๐Ÿคก.
๐Ÿ‘1
vue-i18n-next
v9.9.1

#vue_i18n #i18n #vue_i18n_next

What's Changed

๐Ÿ› Bug Fixes

โ— fix: key-value style messages broken after merging (#1717) by @chojnicki in #1718

๐Ÿ“๏ธ Documentations

โ— chore(typo): update injection.md by @quentinmcq in #1716
โ— Update syntax.md by @hinogi in #1701

New Contributors

โ— @chojnicki made their first contribution in #1718
โ— @quentinmcq made their first contribution in #1716
โ— @hinogi made their first contribution in #1701

Full Changelog: v9.9.0...v9.9.1
Vuetify
v3.5.2

#vuetify

๐Ÿ”ง Bug Fixes

โ— date: format dayOfMonth with NumberFormat instead of DateTimeFormat (d0136e0), closes #18093
โ— group: use index as value if not provided (#19119) (1a23d47), closes #19107
โ— VColorPicker: parse partial input in the current mode (8c01536), closes #18977
โ— VDataTable: use header height from density (f23bcb0), closes #18795
โ— VDatePicker: use start of month for month model (9eb82db), closes #19087 #19116
โ— VDatePicker: don't truncate day names in other locales (9ceade2), closes #19013
โ— VDatePicker: correct generic model type when multiple (c48c2a7)
โ— VForm: always update errors in slot (c0c28d1)
โ— VMenu: set aria-owns id on overlay element (916c9ef), closes #19054
โ— VOverlay: override scroll-behavior when restoring scroll position (2ddc9c5), closes #19109
โ— VWindow: increase pointer-event specificity (b560ead)

๐Ÿ”ฌ Code Refactoring

โ— fix CalendarProps types (adba173)

Other Commmits

โ— chore(release): publish v3.5.2 (0f5ba93)
Vue Updates
Vuetify v3.5.2 #vuetify ๐Ÿ”ง Bug Fixes โ— date: format dayOfMonth with NumberFormat instead of DateTimeFormat (d0136e0), closes #18093 โ— group: use index as value if not provided (#19119) (1a23d47), closes #19107 โ— VColorPicker: parse partial input in the currentโ€ฆ
โ— chore(VSelectionControl/VLabel): update click implementation (3095220)
โ— docs(OneSubCard): update styling (79ae722)
โ— docs(OneSubscription): add billing management link (a7e07b7)
โ— docs(PinnedItems): sort pinned items before save (6da78af)
โ— docs(why-vuetify): update page title (05c3a23)
โ— docs(roadmap): update 2024 roadmap (dfbe631)
โ— test(VDatePicker): add range test (dd32fc6)
โ— docs(components/all): remove duplicated Bottom Sheet Component (#19082) (594b61c)
โ— docs(text-decoration): fix example format issue (#19075) (b9fa960)
โ— docs: update various page's emphasize status (6af93f8)
โ— docs(Banner): update display logic (2d70c07)
โ— docs(sass-variables): make example more clear (416a9a5)
โ— docs(VAppBar): add icon and title to usage example (e6ec41c), closes #18922 #18930
โ— docs(VDatePicker): remove range from props (3fad1e3)
โ— docs(roadmap): update roadmap (132dce2)
โ— docs(scrolling): add version alert (b64e53d)
Vite
v5.1.0-beta.6

#vite

5.1.0-beta.6 (2024-02-01)

โ— feat: experimental Vite Runtime API (#12165) (8b3ab07), closes #12165

โ— fix: add ref() and unref() to chokidar.d.ts for typescript build to work (#15706) (6b45037), closes #15706

โ— perf: simplify explicit import mark in import analysis (#15724) (2805b2d), closes #15724
NuxtJS
v3.10.1

#nuxt3.10.1 is a regularly-scheduled patch release.

โœ… Upgrading

As usual, our recommendation for upgrading is to run:
nuxi upgrade --force

This will refresh your lockfile as well, and ensures that you pull in updates from other dependencies that Nuxt relies on, particularly in the vue and unjs ecosystems.

๐Ÿ‘‰ Changelog

compare changes

๐Ÿ”ฅ Performance

โ— nuxt: Clear route meta build cache when pages change (#25514)

๐Ÿฉน Fixes

โ— nuxt: Fix syntax error when serializing route meta (#25515)
โ— nuxt: Only request animation frame on client (#25569)
โ— schema: Correctly set value for app.viewTransition (#25581)
โ— nuxt: Correct return type of refresh functions (#25568)
โ— nuxt: Broadcast cookie change in correct format (#25598)
โ— nuxt: Generate typed route declarations when building (#25593)
โ— nuxt: Remove key from useId type signature (#25614)
โ— nuxt: Remove $ from generated id in useId (#25615)
โ— nuxt: Don't set default rel for same-site external links (#25600)
Vue Updates
NuxtJS v3.10.1 #nuxt3.10.1 is a regularly-scheduled patch release. โœ… Upgrading As usual, our recommendation for upgrading is to run: nuxi upgrade --force This will refresh your lockfile as well, and ensures that you pull in updates from other dependenciesโ€ฆ
โ— nuxt: Warn if inheritAttrs: false when using useId (#25616)
โ— nuxt: Fetch non-server rendered islands when hydrating (#25613)
โ— nuxt: Don't check page/layout usage when redirecting (#25628)

๐Ÿ’… Refactors

โ— nuxt: Improve NuxtLink types (#25599)

๐Ÿ“– Documentation

โ— Correct typo (#25523)
โ— Add and link to a section on Nuxt context (#23546)
โ— Explain how to set defaults in nuxt config (#25610)

๐Ÿก Chore

โ— Use pathe in internal tests (e33cec958)
โ— nuxt: Rename nuxt -> nuxtApp internally for consistency (c5d5932f5)

๐Ÿค– CI

โ— Fix playwright cache (#25527)
โ— Retry flaky test when running in Windows with Webpack (#25536)
โ— Retry flaky test when running in Windows with Webpack (#25543)
โ— Retry flaky test when using Webpack (#25550)
โ— Simplify label PR workflow (#25579)

โค๏ธ Contributors

โ— Daniel Roe (@danielroe)
โ— Julien Huang (@huang-julien)
โ— Harlan Wilton (@harlan-zw)
โ— Bobbie Goede (@BobbieGoede)
โ— xjccc (@xjccc)
โ— Ryan Clements (@RyanClementsHax)
โ— Enkot (@enkot)
โ— Damian Gล‚owala (@DamianGlowala)
โ— Ted de Koning (@tdekoning)
โ— Troy Ciesco (@troyciesco)
โ— Michael Brevard (@GalacticHypernova)
โ— Arslan Ali (@warlock1996)
Vite
v5.1.0-beta.7

#vite

5.1.0-beta.7 (2024-02-07)

โ— fix: disable fs.cachedChecks for custom watch ignore patterns (#15828) (9070be3), closes #15828

โ— fix: judge next dirent cache type (#15787) (5fbeba3), closes #15787

โ— fix: scan entries when the root is in node_modules (#15746) (c3e83bb), closes #15746

โ— fix(config): improved warning when root path includes bad characters (#15761) (1c0dc3d), closes #15761

โ— docs: fix typos in CHANGELOG (#15825) (3ee4e7b), closes #15825

โ— perf: use transform cache by resolved id (#15785) (78d838a), closes #15785

โ— chore: release notes (#15777) (775bb50), closes #15777
Vuetify
v3.5.3

#vuetify

๐Ÿ”ง Bug Fixes

โ— VAvatar: provide component defaults to default slot (a765a6b)
โ— VCheckbox/VSwitch: incorrect default flex inherited from VInput (de501c3)
โ— VChip: prevent content div from taking activator target (e9a5a4a)
โ— VColorPicker: correct value gradient (d1251f5), closes #19187
โ— VListItemAction: adjust spacing when using the start/end props (1f63ca8)
โ— VOverlay: add missing opacity property (a27026f), closes #19182

๐Ÿ”„ Reverts

โ— Revert "fix(VOverlay): don't render if disabled" (0b79317), closes #19144

Other Commmits

โ— chore(release): publish v3.5.3 (5db19eb)
โ— docs(upgrade-guide): add v-navigation-drawer section (b5ba4a5), closes #19162
โ— docs(one): fix re-sub after billing failure (d8c2943)
โ— docs(AvatarOption): add new images (46f1b0e)
โ— chore(PerkOptions): update displayed pricing (b0543e7)
โ— chore(README): update sponsors (0f6c173)
โ— chore(package): update @vuetify/one (29a8e11)