@aimake/nanod

## 设计模式 NANO DESIGN 是面向于企业级中台化应用的解决方案。服务于 ToB 和 ToE 类型的单页应用,应用于各产品中从而产出了一套设计及前端规范。

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
@aimake/nanod
Minified + gzip package size for @aimake/nanod in KB

Readme

Nano Design

设计模式

NANO DESIGN 是面向于企业级中台化应用的解决方案。服务于 ToB 和 ToE 类型的单页应用,应用于各产品中从而产出了一套设计及前端规范。

简介

Nano Design 是 NANO 设计风格 的 React 实现,用于开发和服务企业级后台产品。 Nano Design 基于 antd 组件库,是 antd 组件的超集。包含了 antd 提供的基础组件,以及符合业务的业务性组件。

特性

完美继承 antd 的换肤方案和按需加载

目录结构

- components/
  - **/                           <-- 存放自开发组件
  - nanoReset.less                 <-- Nano 样式提取样式变量
- dist/
  - nanod.xxx/                     <-- 全量包
- demo/                         <-- 测试 Demo 页面
- lib/                             <-- 所有组件平铺目录(构建自动生成)用于按需加载
- tools/                           <-- gulp 脚本,构建命令
- vendor/                          <-- 第三方包目录 

构建命令

  • npm run clean 清理构建目录,./lib ./dist
  • npm run init-antd 初始化所有 antd 组件,并构建至 ./lib 目录中
  • npm run compile 编译自有组件,并构建至 ./lib 目录中
  • npm run build 构建自开发组件和antd组件,并打包 至 dist

发布

修改 package.json

"version": "0.0.12", 执行 npm publish

API

NanoLayout

Nano 风格的 Layout 组件,继承于 Layout,具体文档请参照 Layout

相较于 Layout,封装了自己的 Logo 组件,

参数 说明 类型 默认值
logo 产品 logo 的 url string ''
title 产品文字 string | ReactNode | () => ReactNode ''

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.