Git Product home page Git Product logo

vue3-news's Introduction

vue3-News

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

🚀 欢迎Star,后续会不断更新。
🇨🇳 最后更新日期:2️⃣0️⃣2️⃣3️⃣
🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳🇨🇳

2023 年您好,(´▽ `)ノノ),继续前行!
【2023】 ≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡-------------- 【2024】

2020/2021/2022 年再见ヾ( ̄ ▽  ̄)ByeBye,感谢自己!
【2020】 ≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡≡ 【2023】

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 正式发布,尤雨溪在线全球发布会:【戳这里

The offical blog for the Vue.js project, The Vue Point.

想了解更多有关 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.3.4 (2023-05-18)

May 11, 2023
Announcing Vue 3.3
Today we're excited to announce the release of Vue 3.3 "Rurouni Kenshin"!

  • build: ensure correct typing for node esm (d621d4c)
  • build: fix DEV flag replacement edge case (8b7c04b), closes #8353
  • compiler-sfc: handle imported types from default exports (5aec717), closes #8355

...

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

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

Announcing Vue 3.3

Vue3.3 发布,版本代号为 “Rurouni Kenshin”
主要改进了DX(开发者体验)、新增一些语法糖和宏,以及 TypeScript 上的改善...

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 年预告

天寒之时必封初冬

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

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

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

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

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

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

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

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

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

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

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

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

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

卖艺不卖身

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

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

License

Released under the MIT License.

vue3-news's People

Contributors

bluezhan avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

vue3-news's Issues

【开源自荐】轻快图床:基于Koa2 + Vue3.x + Vite3.x + typescript开发的轻量级快捷图片管理系统、图床系统

  • 项目名称:轻快图床
    基于Koa2 + Vue3.x + Vite3.x + typescript开发的轻量级快捷图片管理系统、图床系统

  • 项目地址:

  • 项目简介 (100 字以内):
    程序员日常就是写博客,当然写博客时就会涉及到在博文中插入图片,所以往往会使用图床来进行图片资源管理,市面上较流行的图床系统是PicGo,是使用electron-vue开发的桌面应用程序,每次换电脑或者重装系统后都需要重新下载安装并配置图床,比较麻烦。所以开发了这款轻快图片管理系统,是基于vue3.x + typescript + vite + koa + mysql开发的前后端分离图床系统,使用该系统可以不需要每次都配置图床。

  • 项目截图 (6张以内):

    • 上传区
      202211101718307.png
    • 图片管理
      202211101719274.png
    • 存储桶管理
      202211101719413.png
    • 字典管理
      202211101725334.png
    • 相册管理
      202211101720094.png
    • 存储桶插件开发
      202302201023375.png

【整理】前端学习笔记总结清单,应有尽有🍇🍈🍉🍊🍋

学习笔记总结

整理一下年初网上一些总结笔记、杂谈。看看哪些适合你们的口味?

春风又绿江南岸

两岸猿声啼不住

停车坐爱枫林晚

桃花潭水深千尺

千里莺啼绿映红

东风无力百花残

君问归期未有期

【必会】都已经9102年底了,你必须会TypeScript。

【v3.0.0 One Piece】One Piece. Vuejs 3.0 正式版发布!代号:海贼王

Vuejs 3.0 在北京时间2020年9月 19 日凌晨,终于发布了 3.0 版本,代号:One Piece

以下为 Vuejs Release 3.0 机器翻译文章,原文 v3.0.0 One Piece

Vue 3.0 发布

今天,我们很荣幸地宣布 Vue.js 3.0“One Piece”的正式发布。这个框架的新的主要版本提供了改进的性能、更小的捆绑大小、更好的 TypeScript 集成、用于处理大规模用例的新 API,以及为框架未来的长期迭代奠定了坚实的基础。

3.0 版本代表了两年多的开发努力,包括 30+ RFC,2600 多个提交,99 个贡献者628 个 PR,以及核心仓库之外的大量开发和文档工作。在此,我们要对我们的团队成员、贡献者的拉取请求、赞助商和支持者的资金支持,以及更广泛的社区参与我们的设计讨论并为预发布版本提供反馈表示最深切的感谢。Vue 是一个独立的项目,是为社区而创建的,也是由社区来维持的,如果没有您的一贯支持,Vue 3.0 是不可能实现的。

进一步推进“渐进式框架”概念。

Vue 从一开始就有一个简单的使命:成为一个任何人都能快速学会的平易近人的框架。随着我们用户群的增长,框架的范围也在不断扩大,以适应不断增长的需求。随着时间的推移,它演变成了我们所说的“渐进式框架”:一个可以逐步学习和采用的框架,同时随着用户应对越来越多的需求场景而提供持续的支持。

今天,我们在全球拥有 130 多万用户 *,我们看到 Vue 被应用于各种不同的场景,从在传统的服务器渲染的页面上添加交互性,到拥有数百个组件的完整的单页应用。Vue 3 将这种灵活性进一步提升。

分层内部模块

Vue 3.0 核心仍然可以通过一个简单的 <script> 标签来使用,但它的内部结构已经被重新编写成一个解耦模块的集合。新的架构提供了更好的可维护性,并允许终端用户通过 tree-shaking 减少多达一半的运行时大小。

这些模块还暴露了底层的 API,解锁了许多高级用例。

  • 编译器支持自定义 AST 转换,用于构建时的自定义 (例如构建时的 i18n)。

  • 核心运行时提供了一级的 API,用于创建针对不同渲染目标 (如原生移动端WebGL终端) 的自定义渲染器。默认的 DOM 渲染器也是使用相同的 API 构建的。

  • @vue/reactivity 模块导出的函数可以直接访问 Vue 的反应性系统,并且可以作为一个独立的包使用。它可以与其他模板解决方案 (如 lit-html) 配对使用,甚至在非 UI 场景中使用。

解决规模问题的新 API

在 Vue 3 中,基于对象的 2.x API 基本没有变化。不过,3.0 还引入了 Composition API——一套新的 API,旨在解决 Vue 在大规模应用中的使用痛点。组成 API 建立在反应性 API 之上,实现了类似于 React 钩子的逻辑组成和重用,比 2.x 基于对象的 API 更灵活的代码组织模式和更可靠的类型推理。

Composition API 也可以通过 @vue/composition-api 插件与 Vue 2.x 一起使用,目前已经有适用于 Vue 2 和 3 的组成 API 实用库 (如 vueusevue-composable)。

性能改进

Vue 3 与 Vue 2 相比,在捆绑大小 (tree-shaking 时减少了 41%)、初始渲染 (快了 55%)、更新 (快了 133%) 和内存使用 (少了 54%) 方面都有显著的性能提升

在 Vue 3 中,我们采取了“compiler-informed 虚拟 DOM”的方法:模板编译器执行积极的优化,并生成渲染函数代码,以提升静态内容,为绑定类型留下运行时提示,最重要的是,扁平化模板内的动态节点,以减少运行时遍历的成本。因此,用户可以获得两全其美的效果:从模板中获得编译器优化的性能,或者在用例需要时通过手动渲染函数直接控制。

改进的 TypeScript 集成

Vue 3 的代码库是用 TypeScript 编写的,具有自动生成,测试和捆绑的类型定义,因此它们始终是最新的。Composition API 可以很好地处理类型推断。Vetur 是我们的官方 VSCode 扩展,现在利用 Vue 3 改进的内部键入功能支持模板表达式和 props 类型检查。哦,如果您愿意,Vue 3 的打字完全支持 TSX。

实验特性

我们为单文件组件 (SFC,即 .vue 文件) 提出了两个新特性:

这些功能已在 Vue 3.0 中实现并可用,但仅出于收集反馈的目的而提供。在 RFC 合并之前,它们将保持试验状态。

我们还实现了一个当前未公开的 <Suspense> 组件,该组件允许在初始渲染或分支开关上等待嵌套的异步依赖项 (异步组件或具有 setup() 的组件)。我们正在与 Nuxt.js 团队一起测试和迭代此功能 (Nuxt 3 即将发布),并且很可能会在 3.1 版中将其固化。

分阶段发布流程

Vue 3.0 的发布标志着该框架的全面就绪。尽管某些框架子项目可能仍需要进一步的工作才能达到稳定状态 (特别是 devtools 中的路由器和 Vuex 集成),但我们认为今天使用 Vue 3 启动新的绿色项目是合适的。我们还鼓励图书馆作者开始升级您的项目以支持 Vue 3。

请查阅 Vue 3 工具库指南以获取有关所有框架子项目的详细信息。

迁移和 IE11 支持

由于时间限制,我们已推迟了迁移版本 (具有 v2 兼容行为的 v3 版本 + 迁移警告) 和 IE11 版本,并计划在 2020 年第四季度重点关注它们。因此,计划迁移现有 v2 应用程序的用户或要求 IE11 支持人员此时应意识到这些限制。

下一步

发布后的短期内,我们将专注于:

  • 迁移版本

  • IE11 支持

  • 新 devtools 中的 Router 和 Vuex 集成

  • Vetur 中模板类型推断的进一步改进

目前,面向 Vue 3 和 v3 的项目的文档网站,GitHub 分支和 npm dist 标签将保持在下一个状态。这意味着 npm install vue 仍将安装 Vue 2.x,npm install vue@next 将安装 Vue 3。我们计划在 2020 年底之前将所有文档链接,分支和 dist 标签切换为默认值 3.0

同时,我们已经开始计划 2.7,这将是 2.x 发行版的最后一个计划的次要发行版。2.7 将向后移植来自 v3 的兼容改进,并发出有关 v3 中已删除/更改的 API 使用情况的警告,以帮助潜在的迁移。我们计划在 2021 年第一季度开发 2.7,它将在发布后直接变为 LTS,预计有 18 个月的维护时长。

尝试一下

要了解有关 Vue 3.0 的更多信息,请访问我们的新文档网站。如果您是现有的 Vue 2.x 用户,请直接转到迁移指南

转载

此文转载来自Vuejs 3 Release:One Piece. Vuejs 3.0 正式版发布!代号:海贼王

【2020TS】WHY using TypeScript开发???

  • 注释的妙用

我们可以通过/** */来注释TypeScript的类型,当我们在使用相关类型的时候就会有注释的提示,这个技巧在多人协作开发的时候十分有用

type returnType = ReturnType<typeof add>

  • 巧用元组

有时候我们可能需要批量的来获取参数,并且每一个参数的类型还不一样,我们可以声明一个元组如:

function query(...args:[string, number, boolean]){
  const d: string = args[0];
  const n: number = args[1];
  const b: boolean = args[2];
}
  • 巧用Omit
interface User {
    username: string
    id: number
    token: string
    avatar: string
    role: string
}
type UserWithoutToken = Omit<User, 'token'>
  • 运用Record

我们忘记写了一个汽车品牌,他会报错吗?
我们拼写属性名错误了,它会报错吗?
我们添加了一个非上述三个品牌的品牌进去,他会报错吗?
我们更改了其中一个品牌的名字,他会有报错提醒吗?
上述这种写法统统不会,这就需要Record的帮助。

type Car = 'Audi' | 'BMW' | 'MercedesBenz'
type CarList = Record<Car, {age: number}>

const cars: CarList = {
    Audi: { age: 119 },
    BMW: { age: 113 },
    MercedesBenz: { age: 133 },
}
  • 巧用类型约束

在 .jsx 文件里,泛型可能会被当做 jsx 标签

const toArray = <T>(element: T) => [element]; // Error in .jsx file.

加 extends 可破

const toArray = <T extends {}>(element: T) => [element]; // No errors.

  • 交叉类型
  • 联合类型
  • 类型别名

出自:Vue3.0之前你必须知道的TypeScript实战技巧

查看更多

运行的时候有个报错,是什么原因呢

ERROR in /Users/andyyin/Desktop/vue3-News-master/node_modules/@vue/runtime-core/dist/runtime-core.d.ts(1342,115):
1342:115 A rest element type must be an array type.
1340 | export declare function warn(msg: string, ...args: any[]): void;
1341 |

1342 | export declare function watch<T extends MultiWatchSources, Immediate extends Readonly = false>(sources: [...T], cb: WatchCallback<MapSources<T, false>, MapSources<T, Immediate>>, options?: WatchOptions): WatchStopHandle;
| ^
1343 |
1344 | export declare function watch<T extends Readonly, Immediate extends Readonly = false>(source: T, cb: WatchCallback<MapSources<T, false>, MapSources<T, Immediate>>, options?: WatchOptions): WatchStopHandle;
1345 |
Version: typescript 3.9.7

【算法|优化】有关前端算法和优化文章系列-2020

【2020-Q1-News】TypeScript新鲜一波流,自己品尝?

TypeScript 热度继续上升,从 vu3 用 TypeScript 重构这一点就可见一斑。

【填坑大法好】哪些你们踩坑的案例统统到碗里来🌶🌶🌶

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

【最新】TypeScript梳理知识点列表,可否一战?

Is JavaScript 的超集。

TypeScript是JavaScript类型的超集,它可以编译成纯JavaScript。
TypeScript可以在任何浏览器、任何计算机和任何操作系统上运行,并且是开源的。

始于JavaScript,归于JavaScript

TypeScript从今天数以百万计的JavaScript开发者所熟悉的语法和语义开始。使用现有的JavaScript代码,包括流行的JavaScript库,并从JavaScript代码中调用TypeScript代码。

TypeScript可以编译出纯净、 简洁的JavaScript代码,并且可以运行在任何浏览器上、Node.js环境中和任何支持ECMAScript 3(或更高版本)的JavaScript引擎中。

强大的工具构建 大型应用程序

类型允许JavaScript开发者在开发JavaScript应用程序时使用高效的开发工具和常用操作比如静态检查和代码重构。

类型是可选的,类型推断让一些类型的注释使你的代码的静态验证有很大的不同。类型让你定义软件组件之间的接口和洞察现有JavaScript库的行为。

先进的 JavaScript

TypeScript提供最新的和不断发展的JavaScript特性,包括那些来自2015年的ECMAScript和未来的提案中的特性,比如异步功能和Decorators,以帮助建立健壮的组件。

这些特性为高可信应用程序开发时是可用的,但是会被编译成简洁的ECMAScript3(或更新版本)的JavaScript。

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

【开源自荐】vite + vue3 + ts 开箱即用现代开发模板

tov-template

vite + vue3 + ts 开箱即用现代开发模板



仓库地址 🦖

Github 👉 tov-template



动机 🐗

为什么要做这个 模板 呢?

  1. 为下次开发节省浪费在配置上的时间
  2. 结合主流插件整合现代开发架构,提高开发效率


特点 🐳

  1. Vite 的
  2. Vue3 的
  3. 文件路由
  4. 布局系统
  5. Mock 支持
  6. Api 自动引入
  7. 组件自动引入
  8. 图标自动引入
  9. VueUse 支持
  10. TypeScript 的
  11. Windi CSS 的
  12. 暗黑模式支持
  13. SWR 请求支持
  14. pinia 状态管理
  15. pnpm 包管理器
  16. 跳转进度条支持
  17. Inspect 调试支持
  18. 插件自动加载支持
  19. Vitest 单元测试支持
  20. 支持 Markdown 渲染
  21. 路径别名 ~ 支持
  22. 命令行自动创建与删除
  23. i18n 国际化支持
  24. 漂亮的 404 页 支持
  25. tsx 支持
  26. gzip 资源压缩支持
  27. 环境变量配置支持
  28. 统一的代码规范与风格支持
  29. 生产环境自动移除开发日志


【TypeScript阅读实践】你入手了吗?

【整理】前端优化得有个好手段,比如看这个清单🍑🍒🍓🍆🌽

收集前端优化指南

看看哪些适合你,又有哪些可以参考的。

吾观自古贤达人,功成不退皆殒身

东风不与周郎便,铜雀春深锁二乔

我寄愁心与明月,随风直到夜郎西

故人西辞黄鹤楼,烟花三月下扬州

金樽清酒斗十千,玉盘珍羞直万钱

【这是入口】你要找的 vue 源码 全宇宙的都在这!

夜月一帘幽梦,春风十里柔情

介绍 Vue.js 以及 Vue-next 源码分析文章,希望通过学习Vue.js源码获得更好的知识和收获。

vue-next 源码机制

雨里鸡鸣一两家,竹溪村路板桥斜。—— 王建写的《雨过山村》

vue 源码,高度关注




继续前进

Element UI 升级 Vue 3.0 描述可能有误

Element UI 的官方 Vue 3.0 升级版应该是这个 Element Plus 仓库 https://github.com/element-plus/element-plus, 我看目前进度已经升级的差不多完成了。

而 Readme 里面写的 kkb 那个据我所知只是一个培训班的作品,看issue 整个项目还在很初期,让他们的学生认领,至于里面为啥有500多个贡献者 只是因为似乎他把老仓库直接复制过来了,容易给人误导

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

【开源自荐】SolidUI 一句话生成任何图形

本人介绍

本人从事十年年大数据相关工作,做过用户增长,BI,大数据中台,知识图谱,AI中台,擅长大数据AI相关技术栈。在CSDN输出很多专栏,是CSDN博客专家,CSDN大数据领域优质创作者,2018年参与共建WeDataSphere开源社区,社区属性是数据相关综合社区,共建过DataSphereStudio(开发管理集成框架),Exchangis(数据交换工具),Streamis(流式应用开发管理系统),Apache Linkis (计算中间件) 。个人发起SolidUI 图形模型社区。Apache Asia 2022 讲师 ,Hadoop Meetup 2022 讲师,WeDataSphere Meetup 2022讲师。Apache Linkis Committer , EXIN DPO (数据保护官)。

2023年2月开始创业,全职运营SolidUI。

SolidUI介绍

一句话生成任何图形。

随着文本生成图像的语言模型兴起,SolidUI想帮人们快速构建可视化工具,可视化内容包括2D,3D,3D场景,从而快速构三维数据演示场景。SolidUI 是一个创新的项目,旨在将自然语言处理(NLP)与计算机图形学相结合,实现文生图功能。通过构建自研的文生图语言模型,SolidUI 利用 RLHF (Reinforcement Learning Human Feedback) 流程实现从文本描述到图形生成的过程。

SolidUI Gitee https://gitee.com/CloudOrc/SolidUI
SolidUI GitHub https://github.com/CloudOrc/SolidUI
SolidUI 官网地址 https://cloudorc.github.io/SolidUI-Website/
Discord https://discord.gg/NGRNu2mGeQ
CSDN https://limeng.blog.csdn.net/
SolidUI v0.2.0 发版文章 https://mp.weixin.qq.com/s/LikYVv_4O-Gv43wecw-b3w
SolidUI v0.2.0 功能介绍文章 https://mp.weixin.qq.com/s/2wyBmmYxeoNI9NdSM94oFw
SolidUI v0.2.0 教程视频 https://www.bilibili.com/video/BV1C8411R75D
SolidUI v0.2.0 概念视频 https://www.bilibili.com/video/BV11G411Z7Q4
SolidUI v0.2.0 演示环境 http://www.solidui.top/ admin/admin

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.