father icon indicating copy to clipboard operation
father copied to clipboard

docs: 如何将 father 2 中内置的 docz 切换为 dumi 做组件库研发?

Open PeachScript opened this issue 4 years ago • 5 comments

前言

dumi 是基于 Umi 的 React 组件库研发工具,能够提供开箱即用、顺滑流畅的组件研发体验,可和 father-build 一起搭配使用。

下个版本的 father 将会使用 dumi 作为内置文档工具。

迁移步骤

1. 更新依赖

移除无用的 father 依赖,改为 father-builddumi

{
  "devDependencies": {
-   "father": "^2.29.6",
+   "father-build": "^1.18.2",
+   "dumi": "^1.0.34"
  }
}

2. 更新启动脚本

{
  "scripts": {
-   "dev": "father doc dev",
+   "dev": "dumi dev",
-   "build": "father build",
+   "build": "father-build"
  }
}

3. 移除 .fatherrc 中的无用配置

export default {
- doc: { /* 文档配置 */ },
}

4. 替换文档写法

修改 .mdx.md,并将 Playground 或者 JSX 替换为代码块:

- import Foo from './';
- import Playground from 'docz';

# Foo

- <Playground><Foo>Hi father!</Foo></Playgrond>

+ ```jsx
+ import React from 'react';
+ import { Foo } from 'my-library'; // package.name 的配置值
+
+ export default () => Hi father!;
+ ```

5. 替换文档配置

检查 .md 文档中顶部的 frontmatter 配置项,替换为 dumi 的配置项,例如:

- menu: A
+  group:
+    title: A

以上,大功告成,执行 npm run dev 开始全新的组件库研发体验。

如果遇到问题请直接在下方反馈。

PeachScript avatar Aug 21 '20 09:08 PeachScript

按照上面方法从father doc 升级过来的,报错如下:

> father-build
D:\projects\xxx\node_modules\import-lazy\index.js:16
                                return Reflect.apply(importedModule, thisArgument, argumentsList);
                                               ^
TypeError: Function.prototype.apply was called on false, which is a boolean and not a function

zhaoyu69 avatar Oct 10 '20 09:10 zhaoyu69

按照上面方法从father doc 升级过来的,报错如下:

> father-build
D:\projects\xxx\node_modules\import-lazy\index.js:16
                                return Reflect.apply(importedModule, thisArgument, argumentsList);
                                               ^
TypeError: Function.prototype.apply was called on false, which is a boolean and not a function

重新用回 father,命令改回 “father build” 后可以成功打包。

zhaoyu69 avatar Oct 12 '20 07:10 zhaoyu69

只切换 doc 部分不应该会影响到 build 的功能,有复现仓库吗

PeachScript avatar Oct 13 '20 16:10 PeachScript

不想迁移咋办?我能用旧版吗?

chiaweilee avatar Sep 03 '21 06:09 chiaweilee

能,卸载 father,手动安装 docz 最新版 + father-build

PeachScript avatar Sep 03 '21 11:09 PeachScript