序光阴似箭，岁月如水。让我们倒退2022年，回顾走过这段风风雨雨的“升级之路”。NutUI表现如何？成绩单等你打分！2022年是NutUI在技术走廊探索和成长的第四个年头，静静度过它的“童年”时光。NutUI也从单一的Vue技术栈组件库逐渐成长为多端多技术栈组件库，升级设计规范《京东APP愿景》和《京东科技愿景》，适配Taro框架支持小程序开发、拓展React技术Stack、打造NutUI业务组件生态等。2022年是不平凡的一年。前端技术在新冠后期也发生了翻天覆地的变化。低代码（Retool）的兴起，D2C和AI（codefun&ChatGPT）的兴起，给各行各业的开发者带来了巨大的冲击。震惊。但是，NutUI的初衷并没有改变。它制作好的UI组件，服务于原始代码开发者，同时也提供了对低代码平台的支持。在这三英亩的土地上精耕细作。2022年陆续完成React技术栈发布、多端小程序适配、组件功能对比完善、新增单体测试、丰富的主题定制、完善的国际化功能、IDE插件引入-ins、在线代码调试等功能。目的只有一个：“打造易用的移动端组件库，提升开发效率，赋能业务，贡献开源”。React技术栈扩容在这一年，我们完成了React技术栈的扩容。NutUI自发布以来，一直基于Vue技术栈进行迭代升级。随着小组和社区内对React版本的呼声越来越高。2021年6月，我们开始了NutUI-React的规划，随后进入开发。2022年1月，NutUI-React1.0版本发布。基于React17和更快的构建工具Vite，全面使用TypeScript，组件大小60+。下半年，我们继续扩容，修复了160+问题，升级到React18，最终达到70+组件，与Vue.NutUI-React的设计与Vue版本保持一致，如项目结构、道具、小组件事件等，保持产品的统一性。NutUI-React基本保持每周一个版本的迭代频率，快速解决开发者的诉求和问题，共发布大小版本26个。目前，已应用于集团内15+个项目，包括京东万商等部分战略项目。多端小程序的适配今年我们完成了Vue和React两大技术栈对小程序应用的支持。NutUI一直只是移动端的一个H5组件。我们通过集团内的兄弟产品Taro对NutUI的各个组件进行了深度适配。从4月份的NutUI-Vue到12月份的NutUI-React，我们已经完成了所有组件的适配。NutUI完成了从单一的H5组件到小程序组件的进化，为广大小程序开发者带来了便捷和高效。2021年6月，NutUI-Vue完成多端小程序适配，发布《NutUI3.1正式发布：开启多端开发之路》。2022年11月，NutUI-Vue发布京东小程序《NutUI京东小程序发布》。2022年12月，NutUI-React完成多端小程序适配，发布《京东React组件库支持小程序开发》。组件级样式修改今年我们完成了比传统主题定制更细粒度的组件级定制。区别于传统组件库的主题定制，我们用“组件级样式修改”来表达。为了实现“组件级样式修改”，我们做了大量的重构工作，提取了多达500+个样式变量，仅仅为了实现组件样式的完全自定义，最终针对不同的业务场景实现不同的UI（数以千计的场景和数以千计不断变化的UI）。NutUI还提供在线主题定制功能，可以根据需要的场景配置主题颜色，实时预览UI效果。主题自定义配置层分为全局基础变量和组件基础变量，比如组件库的全局主题颜色、字体等样式；组件层的配置更详细，比如圆角、边框大小等都可以设置。快速了解请点击：主题一分钟入门自定义主题皮肤建设今年在支持业务发展的同时，我们联合兄弟部门开发了2套主题：零售B商城主题和零售企业商务主题。截至目前，已有4套官方主题供开发者选择。B商城主题京东B商城旨在打造中国最大的综合性B2B交易平台，构建健康的B商贸生态，致力成为中国最大的商贸交易服务平台。B商城整体还是京东红的风格，但是细节上有很大的不同，重新输出了设计UI稿。第二季度，我们根据B-mallUI实现了B-mall版本主题，为开发者提供了更多的样式选择。企业业务题材第三季度，京东企业业务逐步梳理输出视觉规范。我们按照企业业务视觉规范开发企业业务主题，服务于京东汇财、京东金利、京东企业购等产品。这套主题是根据业务产品和设计师的需求共同修改制定的。共涉及17个组件，优化或新增近百个scss变量，实现企业业务的定制化开发。京东科技主题最后是去年推出的京东科技主题（蓝色）NutUI-JDT。大家可以根据自己的项目需求选择这三套不同UI风格的开发项目。组件国际化能力今年，我们完成了组件国际化能力建设，翻译了4套语言包。2022年第一季度，我们收到了京东国际内部研发团队的需求（满足泰国和印尼移动端的需求）。2022年5月完成组件国际化。国际化支持多语言设置，支持繁体中文、英文、印尼文、泰文语言包，默认使用中文。您可以直接导入语言环境和语言包。如果您有其他语言，可以参考当前的语言包进行快速配置。视频资源：NutUI3.0组件库通用能力提升组件功能差异分析及补全今年，我们分析了业界主流和知名的手机组件库，对比了各个组件的功能，填补了NutUI缺失的功能。“三人同行，必有我师。”从2022Q1开始，我们从组件使用文档、功能点、API等维度对比了业界主流的组件库Vant、Antdmobile、TDesign。并在接下来的9个月内，将新增或修改100+个组件prop，优化70+个组件文档，新增20+个Demo。让NutUI功能更完善，文档更易用。这里还有一个视频分享：NutUI组件能力分析与巩固新深色模式今年我们全面提升用户体验保护视力，新增了深色模式（darkmode）。手机用户主要使用安卓和苹果系统。手机系统显示亮度可暗可亮，即UI的深浅颜色可根据周围环境或时间进行调整，使用户眼睛更加舒适，保护视力。为了提升用户体验，NutUI新增深色模式，根据手机亮度模式自动适配，使用ConfigProvider配置一键自由切换。今年元器件质量提升，元器件质量进一步巩固。除了正常的每月代码审查外，我们还为所有组件添加了单元测试。NutUI现在拥有70+组件，组件库的丰富性可以全面覆盖绝大部分业务场景。俗话说“慢工出细工”，加入单元测试功能，打磨组件质量。单元测试的编写覆盖了大部分应用场景，使测试覆盖率尽可能达到80%以上。每个单元测试都可以自动执行，每个用例都是独立的，相互隔离。断言、快照等关键功能已通过验证。单元测试可以有效排除TS类型、DOM等错误或不规范，进一步检测和排查组件逻辑问题和异常动画效果。开发心得今年，为了提升开发者体验，我们在官网增加了在线调试功能，在主流IDE中开发了NutUI插件。预览调试不是所有的同学都熟悉NutUI，如何让大家快速感知组件的功能和属性呢？一般需要阅读组件的相关文档。组件的文档要完整清晰，例子要全面。经过社区反馈和团队开发，NutUI的组件文档和示例也在一步步完善中。为了提升开发和阅读体验，所有组件demo都增加了在线预览和调试功能codesandbox和codeHouse，让您直观体验组件的各种属性和方法。预览，主要面向产品、测试、运维同学，通过修改组件道具查看实时效果；debugging，主要针对R&D同学，复现问题，测试交互和功能。IDE插件《工欲善其事，必先利其器》。vscode和webStorm仍然是开发神器。基于IDE，我们在年中发布了开发辅助插件，提供组件高亮功能和代码自动补全功能。完整、快速查看文件、道具、活动说明。对于vscode，可以去插件市场搜索nutui-vscode-extension并安装。最好配合Vetur工具使用；只要在webStorm中的项目中有NutUI，就可以直接体验；插件简化了切换浏览器、编辑器等操作，开发得心应手。在开源收获的这一年，我们在开源的道路上坚定前行，与众多社区开发者分享创作成果。我们收获很多，心存感激。到2022年底，NutUI开源产品累计星数6500+，全年NPM下载量激增6.8k，社区用户数突破3600+人。团队成员也积极参与社区技术论坛，分享建设经验。NutUI团队成员受邀参加早早聊天分享会、k+全球软件研发产业创新峰会、K+Talk等技术会议，分享NutUI的成长历程和技术升级。2022年成功入选“科技中国”开源创新榜单，同时作为开源项目参加2022年OpenAtom开源大会。感谢你的努力工作。NutUI的成长离不开社区开发者的反馈与共建。目前贡献者150+，微信服务群4个，内部东东群3个。2022年，开发者共提交代码3,496条，在社区开发者的共同努力下，累计关闭issue3,053条。感谢您的每一次PR！2023展望2022，对大家来说都是不平凡的一年。展望新的一年，NutUI将继续锐意进取，务实执行到底，围绕研发提效、业务赋能，持续夯实品质与体验创新。我们即将迎来NutUI4.0的到来。为了带来更好的产品体验，新版本对架构进行了升级，并进行了一些破坏性的改动。我们提取了单独的图标图标库，方便开发者使用自己的图标库替换，使用pnpm包管理，升级到vite3构建速度提升2-3倍，组件统一BEM规范，使用最新的CSS动态主题特性，以及更新组件瘦身体积减少100kb，采用功能组件，增加Tourguide组件和Pullrefresh组件。官网拆分了H5，小程序应用的使用文档，提供了新的代码风格指南等等，这一切只是为了打造一个好用的移动端组件库，2023年农历新年前发布，所以请给我你最美好的祝福~
