支持 Intact/Vue/React 的前端组件库 kpc

MIT
JavaScript
跨平台
2018-12-14
JaveyZ

动机

目前市面上已经存在大量组件库,我们为什么还要造这个轮子呢?下面我们解释下这个组件库开发的动机。

随着公司业务和团队的壮大,我们很难统一全公司的技术栈,或者也没有必要统一全公司技术栈。众所周知, 前端单页应用的开发无非基于3大框架:React/Vue/Angular。如果不同框架维护一套自己的组件库,一方面 维护成本非常高,存在大量重复劳动力;另一方面,即使大家都按统一的交互设计稿开发组件库,也很难保证 各个组件库交互和设计的完全统一。所以这时kpc应运而生,它存在的意义就是:同一套组件库适应不同框架 (Write once, run anywhere)

特性

  • 支持多框架 Intact / Vue / React

  • 完全可自定义的主题系统

  • 360°全方位定位系统

  • 声明式表单验证

  • 完善的文档和单元测试 文档

安装

在Intact下

npm install intact kpc --save

在Vue下

npm install kpc intact intact-vue --save

webpack配置

module.exports = {
    ...
    resolve: {
        alias: {
            'intact$': 'intact-vue',
        }
    }
}

在React下

npm install kpc intact intact-react --save

webpack配置

module.exports = {
    ...
    resolve: {
        alias: {
            'intact$': 'intact-react',
        }
    }
}

使用

在Intact下

import {Button} from 'kpc';Hello

在Vue下

    Helloimport {Button} from 'kpc';

export default {
    components: {
        Button
    }
}

在React下

import React from 'react';
import {Button} from 'kpc';

class App extends React.Component {
    render() {
        return Hello    }
}

链接

常见问题

1. 使用兼容层来兼容不同的框架,是否有性能损失?

性能损失非常小,因为兼容层并不会出来太多的东西,仅仅只是完成不同框架执行上下文的切换,唯一带来的损失 可能是框架需要引入兼容层和Intact底层库所带来的打包文件的增大,但只是增大了大概80KB(没有开启gzip)的体积, 相比目前前端项目动辄几M的打包文件,增大的并不多

2. 兼容层能实现100%的兼容吗?

如上所述,兼容层仅仅完成上下文的切换,本质上还是谁的元素谁去渲染,所以理论上能实现100%的兼容, 但目前考虑到实际使用情况并没有实现100%兼容,有些注意事项已在文档中说明,如果有需求后面我们会 逐步完善来达到100%兼容性

开发

git clone https://github.com/ksc-fe/kpc.git
cd kpc
npm install
npm run dev:doc

# 测试
npm run test
# 更新测试快照
npm run snapshot
# 部署文档
npm run deploy:doc
# 发版
npm run release
的码云指数为
超过 的项目
加载中

评论(2)

花间一壶酒90
花间一壶酒90
不支持NG, 差评
JaveyZ
JaveyZ 软件作者
有需求就可以搞

KPC v1.1.2 发布,支持 React New Context Api

跨框架的前端组件库KPC v1.1.2发布,主要加入了React 16 New Context Api的支持,同时修复了一些小问题 发布日志: v1.1.2 Add Dialog新增强制关闭事件terminate和回调方法terminate属性 #3...

08/30 14:36

kpc 组件库 v1.1.1 发布,上线主题制作工具

kpc是金山云推出的前端组件库,设计之初就支持灵活的主题定制,并且组件库本身就内置了两套主题,如今上线了在线主题定制工具,方便大家自定义自己的主题。示例主题Material-UI 该版本主要补...

08/20 17:00

支持多框架的组件库 KPC 1.0 正式发布

自从17年11月份对外公布以来,KPC已经经过了8个月的迭代,期间发布了几十个正式版本,但一直没有到1.0,因为我们觉得1.0是个里程碑版本,我们必须做的足够完善才敢称之为1.0。而如今我们有信...

07/17 16:12

kpc v0.8.9 发布,支持多框架的前端组件库

kpc是金山云前端团队推出的跨框架的组件库解决方案,目前支持金山云内部框架Intact,以及流行的Vue/React。开发该组件库的目的是,希望通过一套组件库来满足不同团队之间不同的技术栈的开发需...

05/07 11:51

kpc v0.8.6 发布,支持多框架的组件库

kpc是金山云前端团队推出的跨框架的组件库解决方案,目前支持金山云内部框架Intact,以及流行的Vue/React。开发该组件库的目的是,希望通过一套组件库来满足不同团队之间不同的技术栈的开发需...

03/22 11:02

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

kpc是金山云前端团队推出的跨框架的组件库解决方案,目前支持金山云内部框架Intact,以及流行的Vue/React。开发该组件库的目的是,希望通过一套组件库来满足不同团队之间不同的技术栈的开发需...

03/05 10:50

kpc v0.8.3发布,跨框架的组件库解决方案

kpc是金山云前端团队推出的跨框架的组件库解决方案,目前支持金山云内部框架Intact,以及流行的Vue/React。开发该组件库的目的是,希望通过一套组件库来满足不同团队之间不同的技术栈的开发需...

02/18 14:55

KPC 0.8.2发布,跨框架前端组件库

KPC 是金山云前端团队推出的跨框架前端组件库解决方案,目的是通过一套源码运行在各个框架下,目前支持 Vue/React 两大框架。 本次更新日志如下: Core Add 内置主题ksyun支持再次继承,不会...

01/29 17:13

kpc v0.8.1 React完善版发布,前端多框架组件库

kpc是金山云前端团队开发的支持多框架的前端组件库,如果你的团队同时存在Vue和React技术栈,想找一个适合多个框架的组件库,来保持界面风格统一,kpc是你的不二选择。当然即使没有跨技术栈的...

01/24 00:50

kpc v0.8.0发布,支持多框架的前端组件库

kpc是一个由金山云前端团队开发的支持多框架的前端组件库,目前支持Intact/Vue/React。它可以让你的团队不同技术栈之间开发出来的产品保持设计交互统一 v0.8.0 更新日志 Table支持导出成csv...

01/08 11:52

没有更多内容

加载失败,请刷新页面

暂无问答

test 图片

Date: Sun, 18 Oct 2015 08:52:08 +0800 MIME-Version: 1.0 Content-Type: multipart/related; boundary="--F10003B2E1269894D1BC0E6A8668245C_MULTIPART_MIXED"; type="text/html" X-MimeOL...

2015/10/18 12:49
34
0
dede插件的自定义---PHP篇

dede织梦cms插件的开发,要使用Dreamweaver编辑器,或者zendstudio,myeclipse的IDE开发PHP网站程序。 平台:PHP+dede+ampz 第一步:制作前台程序和模版 前台程序lxl_test_a.php 存放在 根目录...

2015/12/08 13:28
554
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部