漫画救济部分图书馆
最近重建说明(2026年6月):
- 不再在例文件中导入 Javascript faff 标记下, 只是简单的 React 组件示例 .
- 仅有例外的是每个组件下方可见的代码示例——它们使用Vite特定导入特性构建:
import buttonExampleSrc from '../components/Atoms/Button/ButtonExample.jsx?raw'; - 样式-组件 5 QQ 样式组件 6 - 轻微语法变化. 以前在嵌入式CSS中使用嵌入式选择器/"( &)"的使用被假定. 现在它需要明确(像正常的本地CSS).
- 删除了 TriggerConfetti.js 文件 。 我找不到任何用法 可能是私人帮手不再需要了.
一般使用
主要依赖关系
- 维特
- 样式组件
安装软件包
$ yarn add @comicrelief/component-library
将您的应用程序包装为主题
import { ThemeProvider, crTheme } from '@comicrelief/component-library';
在应用程序的 HTML 中装入字体
我们使用安东和蒙特塞拉特字体。 把这些添加到您的前端 index.html <head>数字 :
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Anton&family=Montserrat:wght@400;500;600;700&display=swap"
/>
导入组件
import { HeroBanner } from '@comicrelief/component-library';
开发
要在本地安装 CR- CL, 请运行 :
$ yarn install
要启动 Dev 构建和服务器 :
$ yarn dev
测试:
$ yarn test:unit
测试将贯穿所有Jest测试,并观看快照的任何变化.
要更新工作带来的预期变化:
$ yarn test:unit:update
发表
$ yarn publish:npm
测试
安装 Playwright :
yarn playwright install
运行测试 :
yarn test:e2e:local