当前位置: 首页 > Web前端 > HTML

NutUI3.1正式发布:开启多端开发之路

时间:2023-03-28 14:08:59 HTML

作为京东风格的组件库,我们一直致力于打造更符合开发者体验的组件库。NutUI3.0上线后,我们的研发团队也在不断优化、测试、使用、迭代Vue3相关组件。但是,在开发跨终端小程序的过程中,我们发现并没有合适的组件库来支持多终端开发。为了填补这一空白,也为了优化开发者体验,让NutUI更方便开发者使用,我们决定在NutUI中加入小程序适配多终端的能力。NutUI开启多端征程在当前的商业环境下,目前研发面临的业务场景越来越复杂,产品发布的渠道也越来越多。在商家有了自己的APP的同时,也出现了很多小程序频道。以前研发只需要关注Apps和业务的H5就可以了。自从微信出了微信小程序之后,业内各大互联网公司都纷纷开发了自己的小程序平台,未来可能会越来越多。每个小程序平台都有自己的,如果业务多发布一个频道,研发需要多写一套代码。在业务渠道增多、研发资源紧缺的情况下,编写一套可以在每个小程序中快速复用的代码是当前的研发重点。首要痛点。为了给开发者提供更高效便捷的开发方式,NutUI与Taro强强联手,现在可以使用NutUI开发小程序了。NutUI提供了30+个组件,涵盖了日常业务开发中使用的大部分组件。两者的结合,不仅可以让开发者在一处编码,多终端运行,自由自在地开发小程序。也可以在开发过程中使用更美观、更方便、组件更丰富的组件库。我们将NutUI和Taro结合的更加完美。Taro官方使用NutUI作为Vue技术栈的推荐组件库。现在开发者将可以使用NutUI无缝开发H5和多端小程序。NutUI3.0新架构升级自从NutUI3.0升级后,我们对框架做了一些改动。以下是NutUI3.0的基本框架结构。与2.0相比,我们做了以下升级:Webpack升级为Vite,开发效率大幅提升。全面拥抱TypeScriptVue3支持支持小程序开发视觉体验全面升级NutUI2.0到3.0不仅是全新的技术升级,更是组件库全新的产品形象。NutUI3.0从官网到文档到demo都进行了改版。改版后的首页多维度展示了NutUI组件库的平台特性和知识积累,让新用户更好、更系统地了解NutUI。组件文档的变化在用户时间和注意力稀缺的时代,作为一个工具平台,需要帮助用户方便、高效地实现目标。我们在文档页面的右上角增加了文档切换的tab,方便开发者更高效的找到自己想要的相关文档。我们现在支持小程序预览演示。扫描右侧二维码,直接查看NutUI。3、X组件库小程序Demo。快速启动小程序开发安装通过npm或Yarn安装安装Taro脚手架#使用npm安装CLInpminstall-g@tarojs/cli#OR使用yarn安装CLIyarnglobaladd@tarojs/cli#OR安装cnpm,使用cnpm来安装CLIcnpminstall-g@tarojs/cli!!!值得一提的是,如果在安装过程中出现sass相关的安装错误,请安装完mirror-config-china后再试。npminstall-gmirror-config-china查看是否安装成功taro-v项目初始化使用命令创建模板:taroinitmyApp按照下图依次选择,选择Vue3+NutUI模板时选择vue3-NutUI模板,内置按需加载开发者可以根据自己的使用场景选择全局使用。按需加载示例(推荐用法)import{createApp}from"vue";importAppfrom"./App.vue";import{Button,Cell,Icon}from"@nutui/nutui-taro";import"@nutui/nutui-taro/dist/style.css";createApp(App).use(Button).use(Cell).use(Icon);全局使用示例import{createApp}from"vue";importAppfrom"./App.vue";importNutUIfrom"@nutui/nutui-taro";import"@nutui/nutui-taro/dist/style.css";createApp(App).use(NutUI);注意:这种方式将导入所有组件。通过以上方法,可以快速开发小程序场景。NutUI团队将持续迭代多端功能,让开发者拥有更友好的多端开发体验。未来展望随着NutUI用户群体越来越多,对React版本的需求也越来越大。接下来,我们会投入一部分精力在React技术栈的开发上。NutUI-React将于Q4与大家见面;我们对NutUI的产品体验会不断优化迭代。在Vue版本中,NutUI团队将继续丰富组件;为了满足大部分开发者在使用组件时向上游设计师提供组件规范的需求,我们正在对NutUI设计规范进行输出和编排,即将在官网推出Sketch资源包,敬请期待~为了给您提供更好的服务,希望您能抽出几分钟时间,把您的感受和建议告诉我们,我们会对您的信息严格保密。本次调查为有奖调查,完成问卷的用户可抽取京东欢乐周边礼品。问卷链接:https://get.jd.com/#/survey/index?id=60280链接仓库地址:https://github.com/jdf2e/nutui官网地址:https://nutui.jd.com/3x/#/加入我们:https://nutui.jd.com/#/joinus反馈我们:https://github.com/jdf2e/nutui/issues