Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

bonree-design

Package Overview
Dependencies
Maintainers
1
Versions
177
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

bonree-design

An enterprise-class UI design language and React components implementation

  • 0.4.24-green
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
171
decreased by-55.12%
Maintainers
1
Weekly downloads
 
Created
Source

博睿组件

antd-4.17.4 保持一致并固定此版本

开发

主要文件目录

├── components    # 组件源码和demo
├── docs          # 文档markdown内容
├── site          # 文档网站布局和代码
└── package.json

git 分支

组件库分为绿色主题版、蓝色主题版,分别对应分支bonree-greenbonree-blue

bonree-blue分支基于bonree-green分支并做了一些特殊处理,所以请注意:

  1. 必须先在bonree-green分支修改代码并提交
  2. 再切换到bonree-blue分支,合并bonree-green分支到bonree-blue分支

本地开发

windows 环境不要使用 power shell

$ npm install

$ npm run start
npm install 时 node-gyp 报错解决方案:
  1. mac 环境报错

    点击查看解决方案

    如何查看 npm 全局安装路径

  2. windows 环境下 node-gyp 提示要安装 Python

    Run CMD as Administrator:
    npm --add-python-to-path='true' install --global windows-build-tools
    

    安装 windows-build-tools 需要非常非常长的时间

    如果安装 windows-build-tools 失败,可以尝试手动安装 python

代码规范

基本原则: 多覆盖,少修改

样式改动

4.17.0 及以上版本代码中存在两套主题 less 文件,npm run build打包时使用components\style\themes\default.less,但npm run start则是使用components\style\themes\variable.less.

  • 所有样式改动只能注释源代码再新增代码

    • css 或者 less 语言缺乏逻辑性,但是互相耦合性又极强,保留源代码可以方便以后进行 debug
  • components\style\themes\index.less中配置主题

    • 不要对components\style\themes\default.less做任何改动
    • 不要对components\style\themes\variable.less做任何改动
    • 如果需要覆盖原有 less 变量,在components\style\themes\index.less重新赋值
    • 如果需要新增 less 变量,必须以br-开头命名变量
    • less 变量必须要有注释
    • 全局元素样式增加在文件底部
    //  全局主色
    @primary-color: #00ccd9;
    //  页面、按钮文字颜色
    @text-color: #4e4e4e;
    //  字体最大
    @br-font-size-largest: 16px;
    //  主要用于页面卡片
    @br-border-radius-lg: 5px;
    
  • 组件样式改动

    • 不要修改源代码,不要改变代码结构
    • 不要修改源代码,不要改变代码结构
    • 不要修改源代码,不要改变代码结构
    • 必须使用注释源码,新增代码方式修改组件样式文件
组件逻辑改动

参照官方要求Code convention for antd

文档和 demo 改动

参照官方要求Configuration for Documentation and Demo

构建发布

// 打包编译

$ npm run build
// 发布npm包

$ npm run pub

!!非常重要!!:执行npm run build打包编译前,必须在 package.json 中 name 字段末尾加上'-antd',要不然会编译失败。 执行npm run pub前,必须将 package.json 中 name 字段去掉'-antd',要不然会发布到其他 npm 包中。

// 构建文档网站

$ npm run site

常见问题

antd FAQ

form 表单校验错误提示没有实时同步国际化?

官方 issue

form 表单错误提示的中英文切换需要在项目代码中额外添加

useEff(() => {
  FormInstance.validateFields;
}, [i18n.local]);

Keywords

FAQs

Package last updated on 21 Jun 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc