Reactd组件库开发

css样式

使用sass预处理器->将.sass文件编译成css文件

第三方库

  • react-transition : 动画库
  • fontawesome : 字体图标库
  • axios : http库

组件测试

技术栈: jest + React Testing Library

  • jest框架
    - 一个JavaScript单元测试框架,作为测试运行器,断言库和模拟库
    - mock
    • 对于简单的函数的mock-->jest.fn 来进行mock,
    • 针对不同的情况(返回值或者替换实现)--> 使用mockReturnValue和mockImplementation;
    • 针对类和模块的mock---> jest.mock。
- mock实现
  • React Testing Library 库
    - 一个用于测试React组件的轻量级解决方案,提供额外的测试实用程序,用与用户相同的方式 与元素交互
    - AAA模式:编排(Arrange),执行(Act),断言(Assert)。
    - 基础断言
    expect(counter.textContent).toEqual("1");
  • 模块系统
    - ES modules

开发和文档

storybook
- storybook是一套UI组件的开发环境,可以展示组件库,可视化测试组件,以及生成自动化文档.
- 在项目中安装
npx -p @storybook/cli sb init
- react-doc-gen 自动生成文档插件
- addon 插件系统,

其他

  • js模块类型 : ES Modules
  • Bundler
    • 概念
    • 使用
  • npm发布项目
上一篇:前端自动化测试 jest


下一篇:Jest 使用指南 - - Mock 篇