sxmaps-ui

简介

升学Ui库，基于antd/element，实现了符合升学的统一的交互语言和视觉风格，并结合业务新增了一些通用组件。  

特性

• 基于antd@1.7.2/element@2.14.1实现。
• 兼容antd/element组件，无侵入性。
• 通过配置覆盖/样式覆盖/自定义组件实现UI的统一管理。

支持环境

• 现代浏览器和 IE9 及以上（需要 polyfills）。
• 支持服务端渲染。
• Electron

安装

使用 npm 或 yarn 安装 （推荐）**

$ npm install sxmaps-ui --save

$ yarn add sxmaps-ui

配置覆盖

// antd项目：vue.config.js文件中增加配置
const theme = require('sxmaps-ui/antd/theme')
css: {
  sourceMap: true,
    loaderOptions: {
      less: {
        javascriptEnabled: true,
          modifyVars: theme
      }
    }
}
// element项目：main.js中增加theme引入
import 'sxmaps-ui/element/theme/index.css'

样式覆盖

// antd项目
import 'sxmaps-ui/lib/cover.antd.css'	// 全量覆盖
import 'sxmaps-ui/antd/button/a-button.less' // 按需覆盖

// element项目
import 'sxmaps-ui/lib/cover.element.css'	// 全量覆盖
import 'sxmaps-ui/element/button/e-button.less' // 按需覆盖

自定义组件

// antd项目
import SUI from 'sxmaps-ui/lib/sxmaps-ui-antd.common'
Vue.use(SUI) // 全量引用

import Button from 'sxmaps-ui/antd/button'
Vue.use(Button) // 按需引用


// element项目
import SUI from 'sxmaps-ui/lib/sxmaps-ui-element.common'
Vue.use(SUI) // 全量引用

import Button from 'sxmaps-ui/element/button'
Vue.use(Button) // 按需引用