跨框架组件库解决方案 kpc v0.8.4 发布，新增评分组件 Rate

kpc是金山云前端团队推出的跨框架的组件库解决方案，目前支持金山云内部框架Intact，以及流行的Vue/React。开发该组件库的目的是，希望通过一套组件库来满足不同团队之间不同的技术栈的开发需求，同时相比维护针对各个框架开发一套各自的组件库而言，可以将维护成本将至最低，且可以做到各个框架同步更新

在现有的Vue后者React中引入该组件库只需要配置一项webpack的alias即可，详见文档说明

Vue CLI 3

在项目根目录下创建vue.config.js文件，内容如下：

module.exports = {
    configureWebpack: {
        resolve: {
            alias: {
                'kpc': 'kpc/@css',
                'intact$': 'intact-vue',
            }
        },
    }
}

然后就可以引入kpc组件使用了

Create React App

修改配置之前，我们需要弹出项目的配置文件

npm run eject

然后修改配置文件config/webpack.config.js

--- a/config/webpack.config.js
+++ b/config/webpack.config.js
@@ -265,6 +265,8 @@ module.exports = function(webpackEnv) {
         // Support React Native Web
         // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
         'react-native': 'react-native-web',
+        'kpc': 'kpc/@css',
+        'intact$': 'intact-react',
       },
       plugins: [
         // Adds support for installing with Plug'n'Play, leading to faster installs and adding

更新日志

Add 新增评分组件Rate #218
Add Form支持vertical和inline布局方式 #219
Add Select支持loading状态 #220
Add Datepicker新增getDateString和createDate方法，用于日期字符串和日期对象之间进行转换
Fix 修复Icon不能通过style属性定义图标颜色的问题 #217
Fix 修复Slider属性max/min取值为undefined时会报错的问题 #216
Fix 修复Table在边框模式下，吸顶的表头宽度会超出2px的问题 #222
Fix 修复Dropdown及该类型的组件，在菜单弹出后，点击另一个组件，上一个菜单不会自动隐藏的问题 #221
Fix 修复Datepicker被禁用的日期hover时依然有背景色的问题 #223

陈少鑫

2019-03-05 13:42

前端圈，好热闹。