blueju/blue-design

blue-design，基于曾参与公司组件库搭建及开发的经验，自己搞的一套基础组件库壳子，基本可直接套壳使用。

Hey, I'm blueju!

Hi, I'm blueju, a Frontend Developer 🚀 from China.

blue-design's Issues

semantic error TS2307: Cannot find module 'react' or its corresponding type declarations.

运行开发环境命令 npm run start：

/workspace/blue-design (main) $ npm start

> [email protected] start
> dumi dev

Starting the development server...
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Anchor 锚点/demo-1.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Breadcrumb 面包屑/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Button 按钮/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Button 按钮/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Button 按钮/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Button 按钮/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Collapse 折叠面板/demo-1.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Input 输入框/demo-1.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Pagination 分页/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Progress 进度条/demo-1.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Radio 单选框/index.md
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Tabs 标签页/demo-1.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Tabs 标签页/demo-2.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Tabs 标签页/demo-3.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Tabs 标签页/demo-4.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/TestImagePack 测试图片打包/demo-1.jsx
ERROR [dumi]: cannot resolve module react from /workspace/blue-design/docs/components/Upload 上传/demo-1.jsx

✔ Webpack
  Compiled successfully in 32.80s

 DONE  Compiled successfully in 32801ms

运行构建命令：

/workspace/blue-design (main) $ npm run build

> [email protected] build
> father-build

Clean dist directory
Build umd
✖  error     Error: /workspace/blue-design/src/MyAnchor/index.tsx(1,19): semantic error TS2307: Cannot find module 'react' or its corresponding type declarations.
    at error (/workspace/blue-design/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/shared/rollup.js:5253:30)

semantic error TS2339: Property 'children' does not exist on type 'Readonly<{}>'.

npm run build 构建时报以下错误

gitpod /workspace/blue-design (main) $ npm run build

> [email protected] build
> father-build

Clean dist directory
Build umd
✖  error     Error: /workspace/blue-design/src/MyTabs/index.tsx(19,27): semantic error TS2339: Property 'children' does not exist on type 'Readonly<{}>'. 
    at error (/workspace/blue-design/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/shared/rollup.js:5253:30)
    at throwPluginError (/workspace/blue-design/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/shared/rollup.js:17926:12)
    at Object.error (/workspace/blue-design/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/shared/rollup.js:18533:24)
    at Object.error (/workspace/blue-design/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/shared/rollup.js:18095:38)
    at RollupContext.error (/workspace/blue-design/node_modules/.pnpm/[email protected]_yhwghphjiff4lrlruw42cpuv3m/node_modules/rollup-plugin-typescript2/src/rollupcontext.ts:37:18)
    at /workspace/blue-design/node_modules/.pnpm/[email protected]_yhwghphjiff4lrlruw42cpuv3m/node_modules/rollup-plugin-typescript2/src/print-diagnostics.ts:41:11
    at arrayEach (/workspace/blue-design/node_modules/.pnpm/[email protected]_yhwghphjiff4lrlruw42cpuv3m/node_modules/rollup-plugin-typescript2/node_modules/lodash/lodash.js:516:11)
    at Function._.each [as forEach] (/workspace/blue-design/node_modules/.pnpm/[email protected]_yhwghphjiff4lrlruw42cpuv3m/node_modules/rollup-plugin-typescript2/node_modules/lodash/lodash.js:9368:14)
    at printDiagnostics (/workspace/blue-design/node_modules/.pnpm/[email protected]_yhwghphjiff4lrlruw42cpuv3m/node_modules/rollup-plugin-typescript2/src/print-diagnostics.ts:9:2)
    at Object.transform (/workspace/blue-design/node_modules/.pnpm/[email protected]_yhwghphjiff4lrlruw42cpuv3m/node_modules/rollup-plugin-typescript2/src/index.ts:244:5)

缩进组件

实现让所包裹内容组件可控制缩进几个字符

更多按钮

实现可自由控制按钮展示的数量，剩余按钮收缩

希望表格表头与内容能有各自自己的对齐方式

主要场景在金额显示

表单布局组件

实现表单的简单快速布局几行几列

可编辑标签页

实现可编辑的标签页功能

无法打包构建，报 ts 的 png 类型提示错误

具体报错信息：

...
src/MyTestImagePack/index.tsx(4,19): error TS2307: Cannot find module './example-light.png' or its corresponding type declarations.
...

to do list

• MyAnchor 锚点
• MyBreadcrumb 面包屑
• MyButton 按钮
• MyCollapse 折叠面板
• MyInput 输入框
• MyPagination 分页
• MyProgress 进度条
• MyTabs 标签页
• MyUpload 上传
• MyRadio 单选框

... 还有不少点没写出来，实现后忘了补 ...

• 支持三种打包方式：cjs、esm、umd
• 支持图片也可以被打包出来
  场景：有时候没有 svg 图标，需要用 png 等格式图片作为图标
• 抽离 CSS