首页 > 编程知识 正文

vue3.0新特性,vue什么时候出来的

时间:2023-05-06 20:20:24 阅读:138164 作者:1581

与vue2.x版本相比,vue3.0源代码的组织方式进行了如下更改:

源代码的组织方式的变更都用ts编写,使用monorepo将独立的功能提取到不同的包中添加CompositionApi,90%以上的api与2.x兼容。 解决了2.x版本开发的大型项目中超大组件太大难以分割复用的问题提高了性能,改写了虚拟dom,同时采用proxy改写响应公式采用vite打包工具,通过vite

使用ts改写,为我进行类型检查。 使用monorepo管理项目结构。 将一个源代码划分为不同的包,并将独立的功能提取到不同的包中。 每个模块都可以单独测试源代码的packages目录结构

packages都是独立发行的包,可以独立使用

compiler-core、与平台无关的编译器compiler-dom、与compiler-core相关的编译器compiler-sfc、sfc单文件组件、 用于编译单文件组件的编译器依赖于compiler-core和compiler的服务器端呈现reactivity、数据响应系统runtime-core、平台无关的运行程序与浏览器相关的运行时runtime-test、为测试而创建的轻量级运行时server-renderer、服务器端呈现shared size-core template-explorer、vue、内部版本完成与vue2不同的是,vue3不构建UMD模块,而是具有冗馀性。

packages/vue包含所有内部版本,主要包括

vue.cjs.js vue.cjs.prod.js vue.ESM-browser.js vue.ESM-bundler.js vue.global

cjs(commonjs模块化) vue.cjs.js、commonjs模块化、完整的vue、开发版(包括运行时和编译器)、未压缩的vue.cjs.prod.js、commonjs (一种开发版,包括vue.global.js、完整版的vue、运行时和编译器,包括代码未压缩的vue.global.prod.js、完整版的vue、运行时和编译器,在生产版中代码仅包含未压缩的bue.runtime.global.prod.js、运行时版和生产版,代码仅包含压缩的browser(type=module方式部署(vue.ESM-browser ) ) 生产运行时版、开发版和代码未压缩的bue.runtime.ESM-browser.prod.js,包括未压缩的代码、完整的vue、运行时和编译器代码压缩后的bundler未打包所有代码,必须与打包工具配合使用: esmodule模块化方法vue.ESM-bundler.js vue.runtime.ESM 使用脚手架创建的所有项目都适用于此版本的Composition API设计动机options API中描述性组件选项(如果开发复杂组件,例如包含data (的生命函数),则为相同的功能逻辑Composition api vue.js3.0中新增的基于api集函数的api集可以更灵活地组织组件逻辑

响应性提升系统vue2.x中的响应性系统的核心是defineProperty,它在初始化时遍历data中的所有成员,并通过defineProperty将对象中的属性转换为getter和setter。 如果data的属性也是对象,则必须递归处理为响应对象。在初始化阶段进行这些处理的vue3.x使用proxy对象重写响应系统,而无需在初始化时遍历所有属性如果嵌套了多个级别的属性,则只有在访问属性时才会递归处理。 vue3.0可以接收动态添加的属性。 vue3.0可以接收已删除的属性。 vue3.0可以使用通过接收数组的索引和length属性而优化的vue2.x编译静态根节点。 优化diff过程,但vue2还要求静态节点具有diff,而未优化的vue3.0标记并提升所有静态根节点。 对于diff,与动态节点内容相比,只需在vue3.0中引入fragments(vetur插件升级),而无需为唯一的根节点创建静态升级。 如果在初始化时创建静态节点patch flag,并检查单个patch flag是否需要进行diff缓存事件处理函数,则缓存函数不会改变。 在优化的vue3.0中,实际调用时调用最新函数内容的源代码卷,删除inline-template、filter等不常见的API并减少软件包的卷是一种树型共享请查找要在编译阶段使用的模块

非ie浏览器支持ESModule用于加载将模块标记为module的脚本。 默认情况下,完成文档分析后,在触发DOMContentLoaded事件之前执行vite和vue-cli的时间不同

vite可以在开发模式下直接运行,而无需软件包。 在基于浏览器的esmodule模块vue-cli开发模式下,必须打包项目才能运行。 如果项目很慢,vite将具有在生产环境中使用rollup包、基于esmodule打包vue-cli以及使用webpack打包vite的优点

无需打包即可按需冷启动模块热更新。 无论模块总数如何,模块热更新的速度都将由vite创建项目

vite创建项目基于npminitvite-app project-namecdproject-namenpminstallnpmrundevvite模板创建项目。 可以支持另一个框架。 npminitvite-app-templatereactnet

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。