> dumi babel exapple (base father2)
npm install htweatherimport Styles from 'style/index.css)
"hack": "node scripts/hack-depend.js",对 node_modules 下的依赖进行 hack 处理:~~
typings.d.ts 文件中声明非 js/ts 模块:
ts
declare module '*.css';
declare module '*.less';
declare module '*.png';
declare module '*.jpg';
declare module '*.gif';
`
- package.json 添加脚本命令:
`json
"scripts" : {
"postinstall": "node scripts/hack-depend.js"
}
`
- 写 scripts/hack-depend.js 脚本:
`js
/**
* 重写依赖模块(读取文件查找替换)
*/
const fs = require('fs');
const path = require('path');
const sep = path.posix.sep;
const hacks = [
{
// https://github.com/umijs/father/pull/220 ,官方没时间处理 PR,这里进行 hack 处理
name: 'father-build',
path: '../node_modules/father-build/lib/babel.js',
hack: data => {
// console.log(data)
return data
.replace(
,
,
)
.replace(
&& !path.endsWith('.d.ts');,
&& (path.endsWith('typings.d.ts') || path.endsWith('index.d.ts') || !path.endsWith('.d.ts'));,
)
.replace(
[(0, _path.join)(srcPath, '*/'),,
[(0, _path.join)(srcPath, '../typings.d.ts'),(0, _path.join)(srcPath, '../index.d.ts'),(0, _path.join)(srcPath, '../typings/index.d.ts'),(0, _path.join)(srcPath, '*/'),,
);
},
},
];
const run = () => {
for (const item of hacks) {
const finalPath = path.resolve(__dirname, item.path.replace(/\//g, sep));
fs.readFile(finalPath, 'utf8', (err, data) => {
if (err) {
throw err;
}
// console.log('=====data=====')
// console.log(data.indexOf(&& !path.endsWith('.d.ts');))
// console.log(typeof data)
// console.log(String(data))
// console.log('=====data=====')
const fixed = item.hack(data);
fixed &&
fs.writeFile(finalPath, fixed, err => {
if (err) {
throw err;
}
console.log('hack success');
});
});
}
};
run();
`
---
发包后,在 umi 项目中使用 lean 组件库
$3
`tsx
import React from 'react';
import { Foo, Button } from 'lean';
export default () => {
return (
);
};
`
Getting Started
Install dependencies,
`bash
$ npm i
`
~~Hack dependencies,~~
`bash
$ npm run hack
`
Start the dev server,
`bash
$ npm start
`
Build documentation,
`bash
$ npm run docs:build
`
Build library via father-build,
`bash
$ npm run build
`
Test Components,
`bash
test all components
$ npm run test
`
`bash
test all components with coverage
$ npm run test:coverage
`
`bash
test one component Foo
$ npx umi-test src/Foo/index.test.tsx
``