1.0.12 • Published 1 year ago

myselfantd v1.0.12

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

myselfantd

基本 antd 4.0 二次封装的业务组件库。

1.使用方法

1.1 安装

以 yarn 为例

yarn add myselfantd

1.2 使用

1、 使用包内的 ConfigProvider 组件对应用根节点组件进行包裹,修改全局组件命名空间为 myselfantd

index.js

import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'
import { ConfigProvider } from 'myselfantd'

ReactDOM.render(
  <ConfigProvider>
    <App />
  </ConfigProvider>,
  document.querySelect('#root')
)

2、这样引入组件即可,会按需加载基于 antd 定制过的组件

import React from 'react'
import { Button } from 'myselfantd'

export default () => {
  return <Button type="primary">点我</Button>
}

3、此外 myselfantd 必须全量引入定制过的 antd 样式。

import 'myselfantd/esm/styles/index.css'

PS:如果项目中已经有 antd 3.x 版本,请引入 myselfantd 所有组件样式。

import 'myselfantd/esm/styles/styleWithoutGlobal.css'

譬如在 umi 项目中使用,定位 global 入口

import React from 'react'
import { Button, ConfigProvider } from 'myselfantd'
// + import 'myselfantd/esm/styles/index.css'

export default function IndexPage() {
  return (
    <ConfigProvider>
      <h1>Page index</h1>
      <Button type="primary">button</Button>
    </ConfigProvider>
  )
}