Today Vue Router 4 is officially released as stable. After 14 alphas, 13 betas and 6 release candidates, Vue Router v4 is ready to bring the best of routing to your Vue 3 applications with improved bundle size, TypeScript integration, new features and consistency improvements for modern apps.
It has taken almost 2 years of work, around 1500 commits, 15 RFCs, and the help of many users and their bug reports and feature requests to get here. Thank you all for your very much appreciated help!
🎉 RFC release 🎉 We support monorepo and multi-root workspace in this version. We have also added a new config file called
vetur.config.js
.
We're collecting responses to our survey to find out how developers feel about Vue today!
For the past four years this survey has helped us do just that, by collecting data from over 20,000 developers to identify current and upcoming trends.
This year again, take the survey to help us find out which libraries developers want to learn next, which have the best satisfaction ratings, and much more.
Let's implement state persistence with history support in Vue 3. A good example of an app that properly handles this functionality is excalidraw.
In this post, I will walk you through how I am able to optimally load thousands of images without any loading indicators, screens, or a break in the user experience (UX)
https://twitter.com/wobsoriano/status/1337969743240679424
Vite's dev server is 10-100x faster than Webpack and Vue CLI. Does this mean Vue CLI is obsolete? In this article, we'll compare the two build tools and address their pros and cons.
With the new Vue 3 composition API, the options you have for state management are expanding a lot and some of the libraries I will mention here are pretty cool 💅, you will see... I will just show you the top 4 libraries I considered for my project when I switched to Vue 3.
export default function LangAwareRoutingPlugin(ctx) {
const redirect = ctx.redirect;
ctx.redirect = function localizedRedirect(...args) {
const locale = ctx.app.i18n.locale;
const locales = ctx.app.i18n.locales;
// figure out which part of the args is the URL as the first argument can occasionally be a status code
const pathIdx = typeof args[0] === 'number' ? 1 : 0;
// localize the path in-place
args[pathIdx] = prependLocaleToPath(locale, args[pathIdx], locales);
return redirect(...args);
};
// ...
}
For as long as I can remember, building multi-language websites is the norm in Egypt and catering for multi-language audience is an expectation rather than a "nice-to-have".
So even if you are starting on a project with a single language it will almost be required at some point to add multi-language support to it.
I recently converted a second app from Vue 2 to Vue 3, added TypeScript, and swapped from options api to composition api. Here are my notes from the experience...The steps I followed may not be the most optimal path. I would be shocked if they were. Your mileage may vary (YMMV). After digging through the docs and the Vue CLI API (to check out the add/migration commands) this is where I landed. Hopefully by sharing the steps I went through they will be helpful to some of y'all.
A better fetch API. Works on node, browser and workers.
https://twitter.com/damienmortini/status/1337023971464720384
deno compile