/vue3-News

🔥 Find the latest breaking Vue3、Vue CLI 3+ & Vite News. (2021/2022)

MIT LicenseMIT

vue3-News

Vue3+ & Vue-CLI3+ 开发生态圈资讯

🚀 欢迎Star，后续会不断更新。
🇨🇳 最后更新日期：2️⃣0️⃣2️⃣2️⃣/0️⃣1️⃣
🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳

2022年您好，(´▽｀)ノノ)，继续前行！
【2022】 ≡≡≡------------------------------- 【2023】

2020/2021年再见ヾ(￣▽￣)ByeBye，感谢自己！
【2020】 ≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡ 【2022】

Twitter vue3: vue 3 will be available by the end of Q2.(done)

第四届Vue.js开发者大会由Vue.js官方举办，于2021年05月22日在杭州正式开启。本次大会将主要采用在线直播方式与大家呈现，线下会有听少量听众席位！w3ctech
VueConf 2021 PPT & Video

2020年9月18日星期五，Vue的作者尤雨溪发表主题演讲，正式发布Vue3.0并回应一些大家关切的问题。表示不建议大家立刻升级到Vue3.0版本，之前项目中某些依赖项可能还不支持新版，等社区完善后再进行迁移也不迟。

Vue3.0正式发布，尤雨溪在线全球发布会：【戳这里】

想了解更多有关 Vue 3.0 的信息，请大胆访问：v3.vuejs.org

除了单独 Vue3 资讯，欢迎查看更多 vue.js 资讯：【【🔥Vue.js 资讯 📚】目前 web 前端开发非常火爆的框架；定时更新，欢迎 Star 一下。】

欢迎━(｀∀´)ノ亻!
各位大佬们前来玩耍！！！

目录

🐣 关于旧版本

Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。

🐥Node 版本要求

Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。

🐓Vue 3.0 源代码

当大多数国人还在庆祝国庆节的时候，尤雨溪大大在昨天凌晨发布了 Vue 3.0 源代码，源码地址：https://github.com/vuejs/vue-next 。虽然目前还 处于 Pre-Alpha 版本，但是可以预见后面的 Alpha、Beta 等版本应该不会太遥远。
之前，就有预言，除了性能优化、脚手架和新功能外，TypeScript 绝对是一个重点，因此，在 Vue 3.0 源代码版本中，98%代码由 Typescript 编写，相信后面会是 100%。
通过本次发布的源代码可以了解到针对 Vue 3 计划并已实现的主要架构改进和新功能。
Vue 3 中最主要的新特性：组合式 API，已经可以借助 https://github.com/vuejs/composition-api （在 Vue 2 项目中作为插件使用）体验到。

yyx990803 yyx990803

3.2.22](https://github.com/vuejs/vue-next/compare/v3.2.21...v3.2.22) (2021-11-15)

  • compiler-sfc: add type for props include Function in prod mode (#4938) (9c42a1e)
  • compiler-sfc: add type for props's properties in prod mode (#4790) (090df08), closes #4783
  • compiler-sfc: externalRE support automatic http/https prefix url pattern (#4922) (574070f), closes #4920
  • compiler-sfc: fix expose codegen edge case (#4919) (31fd590), closes #4917
  • devtool: improve devtools late injection browser env detection (#4890) (fa2237f)
  • runtime-core: improve dedupe listeners when attr fallthrough (#4912) (b4eb7e3), closes #4859
  • types/sfc: fix withDefaults type inference when using union types (#4925) (04e5835)

...

v3.0.0 One Piece

v3.0.0 One Piece

Today we are proud to announce the official release of Vue.js 3.0 "One Piece". This new major version of the framework provides improved performance, smaller bundle sizes, better TypeScript integration, new APIs for tackling large scale use cases, and a solid foundation for long-term future iterations of the framework.

One Piece. Vuejs 3.0 正式版发布！代号：海贼王

🔥🐔2020 前端面试秘籍

【吐血整理清单一】前端面试全攻略，为您保驾护航，金三银四
【吐血整理清单二】前端面试全攻略，为您保驾护航，金三银四
【吐血整理清单三】前端面试全攻略，为您保驾护航，金三银四

秘籍在手，天下我有； 只要你想进，那么世界就是你的。

🐔 前端整理之道

【整理】前端优化得有个好手段，比如看这个清单 🍑🍒🍓🍆🌽
【整理】前端学习笔记总结清单，应有尽有 🍇🍈🍉🍊🍋

🦃 关于 TypeScript

【2020-Q1-News】TypeScript 新鲜一波流，自己品尝？
【最新】TypeScript 梳理知识点列表，可否一战？
【必会】都已经 9102 年底了，你必须会 TypeScript。

为什么要学习它？
因为：

  • 按需输出 JavaScript 版本
  • 代码标准化利于团队开发
  • 主流框架及最新特性的支持
  • 便于重构和主流 IDE 支持
  • 更多友好特性和检测
    ...

哈哈哈，并不是，是因为都已经 2020 了，大公司和你们都在用。

Vue3-CheatSheet

由 Vue Mastery 网站归纳的 Vue 3 Cheat Sheet， 直观地概况了其主要特性。

Vue3 Cheat Sheet Vue3 Cheat Sheet

Votar

⚡ Explore high-performance tooling for Vue

Vue Language Features
Vue language support extension for VSCode
TypeScript Vue Plugin
VSCode extension to support Vue in TS server
vue-tsc
Type-check and dts build command line tool

Discord: https://discord.gg/5bnSSSSBbK

https://github.com/johnsoncodehk/volar

vueuse

antfu/vueuse

like React hooks.
Collection of essential Vue Composition API utils works for Vue 2.x and 3.x https://vueuse.js.org/

Collection of essential Vue Composition API (inspired by react-use)

🚀 Features

  • ⚡ 0 dependencies: No worry about your bundle size
  • 🌴 Fully tree shakable: Only take what you want
  • 🦋 Type Strong: Written in Typescript
  • 🕶 Seamless migration: Works for both Vue 3 and 2
  • 🌎 Browser compatible: Use it though CDN
  • 🎪 Interactive docs & demos: Check out the Storybook!
  • 🔌 Optional Add-ons: Firebase, vue-i18n, etc

新年新气象

新的一年，继续前行；希望各位顺顺利利，心想事成。

💃🏻 撸 vue3 的姿势 💃🏻

🐯 🦁 🐮 🐷 🐹 🦊

霸气姿势观望 vue3 核心技术 ing

  • Proxy：不只是解决了 defineProperty 的局限性。
  • Performance：性能更比 Vue 2.0 强。
  • Tree shaking support：可以将无用模块“剪辑”，仅打包需要的。
  • Composition API：组合 API。
  • Fragment, Teleport, Suspense：“碎片”，Teleport 即 Protal 传送门，“悬念”。
  • Better TypeScript support：更优秀的 Ts 支持。
  • Custom Renderer API：暴露了自定义渲染 API。

TODOLIST：

  • 1 Docs & Migration Guides
  • 2 Router
  • 3 Vuex
  • 4 CLI
  • 5 新工具：vite（法语 “快”）
  • 6 vue-test-utils
  • 7 DevTools
  • 8 IDE Support (Vetur)
  • 9 Nuxt

介绍 Vue.js 以及 Vue-next 源码分析文章，希望通过学习Vue.js源码获得更好的知识和收获。
【这是入口】你要找的 vue 源码 全宇宙的都在这！

v3.0.0 One Piece

「我是要成为海贼王的男人」

2021 => 我最棒(๑•̀ㅂ•́)و✧

🏆 🥇 🥈 🥉 迟序之数，非出神怪，有形可检，有数可推。——祖冲之 🏅 🎖 🏵

♾ 💲 💱 ™️ ©️ ®️ 〰️ ➰ ➿
春天不是读书天, 夏日炎炎正好眠, 秋有蚊虫冬怕冷, 整理书包待明年.
🔚 🔙 🔛 🔝 🔜

🌺 🌸 🌼 🌻 🌞 🌝
四季如春的小城, 似乎没有什么最好的季节, 如果一定要选, 我觉得有一些小雨的夏末最是温柔清 ...

❤新年新心情❤

2020，再见ヾ(￣▽￣)ByeBye

vue => Q3 2020

3.0: Release Management

  • Regression testing for 3.0
  • Automated nightly release
  • Formalize release lifecycle
  • setup CLA process

3.0: IE11 compat build
3.0 Official Release

2.7

  • Backport compatible 3.x features to 2.x
  • Deprecation warnings for 3.x changes
  • This will be the last minor release for 2.x and be offered as LTS (long-term support) for 18 months. It will continue to receive critical security updates even after the LTS period.

Vue 3 Deep Dive with Evan You 【中英字幕】- Vue Mastery
课程中提到的预备课程是《Vue3 响应式原理》

里面评论区和弹幕有在调侃尤大大的：

=》尤雨溪就是个写前端的，懂什么vue！
=》你一点都不懂vue
=》他懂个锤子的vue
=》他根本不懂vue

=>兄弟姐妹们，你们的饿了么升级为vue3了，在紧急构建中，很多大佬都在。
【🎉 A Vue.js 3.0 UI Library element-plus.org/】

从Vue 2到Vue 3的迁移指南

  • vue3指南—01安装
  • vue3指南—02介绍
  • vue3指南-03应用实例
  • vue3指南-04 Template Syntax template语法
  • vue3指南—05 Computed属性(property)和侦听器
  • vue3指南-06 Class and Style Bindings 类名和样式值绑定
  • vue3指南-07 Conditional Rendering 条件渲染
  • vue3指南-08 List Rendering 列表渲染

Vue 组合式 API

🚴🏻 🚴🏻‍♂️ 🚴🏻‍♀️ 🚵🏻 🚵🏻‍♂️ 🚵🏻‍♀️

vue3.0 Composition API 入门教程

vue3.0 Composition API 上手初体验 构建基本项目开发环境
vue3.0 Composition API 上手初体验 构建 vue 基础代码
vue3.0 Composition API 上手初体验 使用 vue-router 构建多页面应用
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (一) 响应数据的绑定
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (二) 响应对象数据的绑定
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (三) 生命周期函数
vue3.0 Composition API 上手初体验 神奇的 setup 函数 (四) 计算属性 computed
vue3.0 Composition API 上手初体验 普通组件的开发与使用
vue3.0 Composition API 上手初体验 vue组件的具名插槽 slot 的变化
vue3.0 Composition API 上手初体验 函数组件的开发与使用
vue3.0 Composition API 上手初体验 用路由循环，做个导航菜单

李金文 / vue-next学习

vue-next 贡献指南（谷歌翻译版）
《Vue3.0抢先学》系列之：网友们都惊呆了！
《Vue3.0抢先学》系列之：一个简单的例子
《Vue3.0抢先学》系列之：使用Composition API
《Vue3.0抢先学》系列之：响应式之Ref vs. Reactive
《Vue3.0抢先学》系列之：使用render函数
《Vue3.0抢先学》vue-next 学习总结
《Vue3.0抢先学》系列之：组件属性Props
《Vue3.0抢先学》系列之：组件生命周期
《Vue3.0抢先学》系列之：更多响应式API示例（watch,computed的变种）

What you will love in Vue 3
Prepare yourself for what to expect in Vue 3 with Alex Kyriakidis' presentation from the Vue.js Amsterdam conference.

GitHub - vuejs/vite: Make Web Dev Fast Again
Vite is an opinionated web dev build tool that serves your code via native ES Module imports during dev and bundles it with Rollup for production.

Vue.js 3 Course - Composition API, TypeScript, Testing
Vue.js 3 introduces some changes to the Async Component API - find out the changes, and how you can use Async Components with Webpack 5's bundle splitting to make your apps load faster than ever.

The case for HOC vs The Composition API
In this article Abdelrahman compares Higher-Order Components (using scoped-slots?content_source_url=https://github.com/vue3/vue3-News) with the upcoming Composition API. I especially enjoyed the Vee-Validate v4 comparison. Check it out!

Vuetensils 0.6: Simpler Forms, Better Accessibility, & Useful Filters!
The latest version of Vuetensils has some really cool features: improvements to form authoring, accessibility updates, and new filters to make life easier.

GitHub - vuejs/vitepress
GitHub - Akryum/vue-mention
GitHub - alvarosaburido/vue-dynamic-forms

再谈 vue3

尤大推出vue3 beta之后

🍁 🍄 🌾 💐 🌷 🌹 🥀 🌺 🌸 🌼 🌻
各位亲(づ￣ 3 ￣)づ ╭❤ ～，悠着点、悠着点。
🍁 🍄 🌾 💐 🌷 🌹 🥀 🌺 🌸 🌼 🌻

vue 官方提供的尝鲜库：https://github.com/vuejs/composition-api

迎接 Vue3.0 系列

👹 👺 💀 👻 👽 🤖

最新资讯-继续前进 ╰(°▽°)╯

英文资料

2019 年中旬

天王盖地虎, 宝塔镇河妖

文章列表标题 介绍
I_am_a_placeholder_placeholder_placeholder nothing
为 vue3 学点 typescript, 解读高级类型 第一课, 体验 typescript;
第二课, 基础类型和入门高级类型;
第三课, 泛型;
第四课, 解读高级类型;
第五课, 什么是命名空间(namespace);
Vue 3.0：更快、更小、让开发者更轻松 在 11 月 14 日-16 日于多伦多举办的 VueConf TO 2018 大会上，尤雨溪发表了名为 “ Vue 3.0 Updates ” 的主题演讲，对 Vue 3.0 的更新计划、方向进行了详细阐述。
Vue 3.0 前瞻，体验 Vue Function API 最近 Vue 官方公布了 Vue 3.0 最重要的 RFC：Function-based component API，并发布了兼容 Vue 2.0 版本的 plugin：vue-function-api，可用于提前体验 Vue 3.0 版本的 Function-based component API。笔者出于学习的目的，提前在项目中尝试了 vue-function-api。
Vue 3.0 之前你必须知道的 TypeScript 实战技巧 很多人对 TypeScript 的使用还停留在基本操作上,其实 TypeScript 的特性非常强大,我们利用好这些特性可以有效地提高代码质量、加速开发效率，今天就介绍 9 个非常实用的 TypeScript 技巧或者特性.
Vue CLI 3.x 与 2.x 的区别 cli3 新增模式概念，每个模式在项目中都有对应的配置文件，项目启动时，对应的文件就会加载，与环境变量不同，一个模式可以包括多个环境变量。
Vue 3.0 RFC API 的实现 Vue3.0 的 RFC 已经发布了几个月了，Vue 底层几乎没有变动，还是沿用原来响应式的。所以一直在思考能不能使用现在的版本，实现 RFC 中的 API，直到看到了 Vue Function API 这个库，这个库让开发者提前尝鲜到了 RFC 中的 API，当然作为 RFC，所以最终 3.0 的 API 还是未知的，以及底层的实现也还未知。
Vue.js 3：面向未来编程（function-based API） 如果你在使用 Vue.js，那么可能知道这个框架的第 3 版就要出来了（如果你是在本篇文章发布后的一段时间看到这段话的话，我希望我的说法还是中肯的 😉）。新版本目前正在积极开发中，所以可能要加入的特性都可以在官方的 RFC（request for comments）仓库中看到：github.com/vuejs/rfcs 。其中有一个特性 function-api，将会在很大程度上影响我们未来 Vue 项目的编写方式。
来自 Vue 3.0 的 Composition API 尝鲜 前段时间，Vue 官方释出了 Composition API RFC 的文档，我也在收到消息的第一时间上手尝鲜。虽然 Vue 3.0 尚未发布，但是其处于 RFC 阶段的 Composition API 已经可以通过插件 @vue/composition-api 进行体验了。接下来的内容我将以构建一个 TODO LIST 应用来体验 Composition API 的用法。
vue-cli 3.0 脚手架，从入门到放弃（二） 想写好代码，和用好一个工具是离不开的， 一般我们使用的工具有 HuilderX,sublimetext3，vscode，webstorm 等，个人目前使用的是 hb，和 vscode，可以根据个人爱好各自选择，但一定要熟练。
vue-cli 3.0 脚手架，从入门到放弃（三） 来总结下流程， 从我们 npm run serve 开始，打开 localhost:8080 端口，首先会加载 index.html。然后去 app.vue 里查找路由组件，这是会调动 router.js 里的配置，选择首先要打开哪个文件，找到我们的那个 path：'/'的页面，浏览器显示。完成。

2019 年上旬

不要叫我达芬奇

2019.01-2019.07

2018 年预告

天寒之时必封初冬

1、Vue CLI 3 搭建 vue+vuex 最全分析

介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。有三个组件： CLI：@vue/cli 全局安装的 npm 包，提供了终端里的 vue 命令（如：vue create 、vue serve 、vue ui 等命令） CLI 服务：@vue/cli-service 是一个开发环境依赖。

2、Vue.js 2 vs Vue.js 3 的实现

vue.js 核心团队已经讨论过将在 Vue3 实现的变化。虽然 API 不会改变，但是数据响应机制（译者注：对数据改变的监听和通知）发生了变化。这意味着什么呢，同时它对你意味着什么呢？

3、vue3.0 快速创建项目

vue3.0 使用了 cli3 快捷搭建的技巧和配搭

4、Vue.js 3.0 PPT（附部分中文翻译）

Evan You 刚刚发布了最新的 Vue 3 和他在 Vue Toronto 的演讲内容：

5、vue3.0 初体验有哪些实用新功能

关于项目创建，除了命令创建 3.x 还增加了图形化界面创建以及管理 vue 项目 在创建新项目时还可以混合选用多种集成

6、Vue 3.0 的生命周期

ue 3.0 的生命周期多了哪些东西和其中又改变了什么

7、Vue-cli 3.0 初体验

如今上 Vue 官网一看，脚手架都早已出 3.0 版了。唉，果然干这行一天不学习都感觉要落伍……

8、重磅！Vue CLI 3.0 正式发布，带来多项重大更新

近日，Vue 的作者尤雨溪在 Medium 上宣布正式发布 Vue CLI 3.0，它也将为很多开发者带来期待已久的新特性。

9、译文：Vue.js 3.0 开发计划

在上周的 Vue.js 伦敦会议上我简短地透露了下个版本的 Vue 的新特性。这篇文章讲深入地阐述

10、Vue 下个版本的计划。Vue CLI 2&3 下的项目优化实践：CDN + Gzip + Prerender

这些优化方案适用于 Vue CLI 2 和 Vue CLI 3 , 文章主要基于 Vue CLI 2 进行介绍，关于如何在 Vue CLI 3 中进行相关的 webpack 调整，我已经放在了 vue-cli3-optimization 这个仓库下，并配有详细的注释，且额外添加方便 Sass 使用的 loader，使用 Sass 时无需再在每个需要引入变量和 mixin 的地方，每次都很麻烦的 @import。下面将详细介绍这些优化方案的实践方式和效果。

11、Vue CLI 3 发布：精简配置，增加图形界面，还有这些新功能

不同的项目往往有不同的需求，所以 webpack 这种高可配的打包工具才会火起来，但同时也被骂太复杂了。所以很多人就想简化或者封装配置，例如 facebook/create-react-app 将所有的配置脚本封装为 NPM 软件包。

12、专访 Vue 作者尤雨溪：Vue CLI 3.0 重构的原因

上个月，Vue CLI 3.0 正式发布，为很多开发者带来期待已久的新特性，尤雨溪也说 Vue CLI 3.0 经历了重构，旨在尽可能减少现代前端工具在配置上的烦恼，并尽可能在工具链中加入最佳实践，让其成为 Vue 应用程序的默认实践。为了获取更多细节，InfoQ 采访了尤雨溪，以下是对采访内容的整理。

13、重磅！尤雨溪发布 Vue 3.0 开发路线

在上周的 Vue.js 伦敦大会上，尤雨溪简要介绍了 Vue 下一个主要版本要发布的内容，9 月 30 日，尤雨溪在 medium 个人博客上发布了 Vue 3.0 的开发路线，全文如下

卖艺不卖身

博学之，审问之，慎思之，明辨之，笃行之。

作者：蓝少 (@bluezhan) 版权声明：自由转载-非商用-非衍生-保持署名（创意共享 3.0 许可证）

License

Released under the MIT License.