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 | '' |