Apr 12, 2021

#192: Vue 3.0 to drop IE 11 support (RFC); 2 days until Vueconf.us; Component testing in Cypress;

Revue

April 12 · Issue #192 · View online

Hi there!

Last month might not have been the most eventful when it comes to Vue news, but there’s been plenty of exciting new libraries for Vue 3.0. Those include:

🍍Pinia – a new Vuex alternative created by Eduardo San Martin Morote
✋Vue-UseGesture – a composable that helps you handle all kinds of mouse and touch events, including complex gestures by Mesut Koca
🪄useMagicKeys – a composable that allows you to easily set keyboard shortcuts by Anthony Fu and the VueUse team
📐Splitpanes – a library that makes dynamic splitpanes a breeze by Antoni “antoniandre”

There’s also been one pretty impactful news – Vue 3.0 will likely drop support for IE 11. As dramatic as it sounds, Vue 3.0 was not supporting IE 11 at any time, but there was the plan to create a 3.0-compat build, that would support IE 11. Instead, the new idea (still in RFC) is to backport as many Vue 3.0 features (like the Composition-API) back into Vue 2.x. This should both ensure a smoother migration from Vue 2.x to 3.x, while also reducing the maintenance burden of supporting 2 builds of Vue 3.0. Additionally, this also removes the need to support IE 11 by all the 3rd party libraries.

It also means that the Composition-API plugin for Vue 2.x will be obsolete, which is a good thing, because once the API becomes part of the core, the plugin-performance-tax will be removed. As an added benefit, Vue 2.x is being migrated to TypeScript as we speak, which should improve the overall developer experience of those using TS.

Lastly, VueConf.us is happening in on April 14th. It’s a completely free event and from what I’ve heard, there are some exciting announcements to look for! Don’t miss it – the tickets are available only until April 13th. ⏰

Stay safe and enjoy the rest of the newsletter,

— Damian Dulisz

P.S. Bento is now 6 months old! It’s incredible how fast he has grown! Just yesterday, he was this tiny boy and now he looks so serious! Especially when he’s suspicious about his half-birthday cake! 🎂

📖 Read the issue online

Go to news.vuejs.org.

Submit new stories at news.vuejs.org/submit.

News

Proposal for dropping IE 11 support in Vue 3 · Discussion #296 · vuejs/rfcs · GitHub

github.com – Share

Though Vue 3.0 is not currently supporting IE 11, there was the idea to ship a compat built that would support it. However, after the recent developments, the team figured that it might be better to instead port as many Vue 3.0 features into Vue 2.x core (including the composition-API) instead. Additionally, the Vue 2.x codebase is being rewritten in TypeScript.

Vueconf.US

@vueconfus

#vueconfus is NEXT WEEK!!!

Just sayin...

April 13-14
https://t.co/jbhXYqM98r
Virtual. @vuejs Love. https://t.co/NJk8Wg9tOY

8:10 PM - 5 Apr 2021

Evan You

@youyuxi

Built an online playground for Vue 3 SFCs: https://t.co/ctVgZj7uMp

- Uses actual @vue/compiler-sfc, bundled to run in the browser, deployed for every commit
- Supports features like <script setup>
- Sharable URL (useful for reproductions)
- Download as Vite project

6:24 PM - 29 Mar 2021

Vue Storefront Summit 2021 – April 20-21, 2021

www.vuestorefront.io – Share

If you’re working with e-commerce you might be interested in the upcoming conference around Vue Storefront. Besides Vue Storefront itself, the conference talks will also mention integrating with headless e-commerce and CMS tools. The last one, might be useful even if you’re not in the c-commerce business.

Vue- The Road To Enterprise

Vue - The Road To Enterprise

theroadtoenterprise.com – Share

[SPONSORED] Buy now and get 30% OFF + bonus videos covering:

Composition API
Compound Components Pattern
How to Write Cleaner Code Using Modern JavaScript Features

Master advanced patterns and best practices for Vue apps and become production-ready with “Vue - The Road To Enterprise”, the most advanced Vue book written.

Articles & Videos

Introducing Component Testing with Cypress – Lachlan Miller

www.youtube.com – Share

Component Testing in Cypress is a new feature coming up in Cypress 7.0 and is potentially a game-changer for writing component tests (both small units and larger interface tests). In this video, Lachlan shows how you can use it with Vue.

How to easily sync with multiple v-models in Vue 3 using Composition API – Thomas Findlay

theroadtoenterprise.com – Share

Vue 3 has brought many new features, and the ability to use more than one v-model directive on the same element is one of them. I want to share with you a quick tip on how to handle updating the state of a parent component when using multiple v-models. It’s especially useful when dealing with forms.

The Quasar Show - Episode 1 – Luke Diebold

www.youtube.com – Share

Luke Diebold has started a new series of videos called “The Quasar Show”! In this episode they cover recent Quasar news, usage with the Composition-API, showcase of live projects and more advanced tips & tricks that you might not have known about.

Comparing the New Generation of Build Tools – Hugh Haworth

css-tricks.com – Share

A bunch of new developer tools have landed in the past year and they are biting at the heels of the tools that have dominated front-end development over

Develop with Vite - Talk Transcript + Slides – Anthony Fu

antfu.me – Share

A great talk by Anthony, that first explains how Vite works and then showcases a combination of Vite plugins that together make up for an awesome developer experience.

Rewriting Nuxt Hacker News with Fastify, Vite and Vue 3 - Jonas Galvez

vuejsdevelopers.com – Share

Learn how to make a fast, maintainable Vue 3 app with Fastify and Vite.

Developing A Vue 3 Headless Component – Max Gfeller

www.maxgfeller.com – Share

What are headless components? And how can they be developed using Vue 3?

API Factories for Vue.js & Nuxt – Nada Rifki

www.telerik.com – Share

How are you organizing your API calls? Have you considered API factories to make your codebase easier to work with, increasing your team’s productivity?

💚 Sponsors 💙