这是一个 React 的 Componment Development Kit (CDK)。它是一个功能强大得多的工具,而不仅只是又一个脚手架。它是由Kadira 出品并提供支持。javascript
React很是棒!!你能够用它来创造一些很酷的东西,并且你想把你的做品分享到社区。可是,这会很难。java
构建开发环境真的是很是的困难和繁琐。咱们已经讨论过这个问题。(JS Fatigue)react
即便你已经很擅长搭建起正确的构建工具,可是维持他们而且更新它们仍然困难繁琐。若是你同时在维持几个 React 项目,这个问题将会变得更加困难。git
React CDK 并非 JS Fatigue 的答案,可是它可使你在写 React 组件和业务的时候没必要担忧构建工具和其余的东西。你将会获得最大的自由度,你也不须要再从新发明什么轮子。github
?: 听起来很酷,告诉我更多的东西。npm
React CDK 是一个 [yeoman] 构造器,包括一系列使 React 组件开发更加简单和有趣的构建工具。你能够用它来作不少事情,包括:json
用一条命令构建一个项目。bash
用 ES2015+ 语法写 React 组件。app
使用React Storybook,一个实时开发环境。编辑器
使用 Mocha 和 Enzyme 来写测试。
使用 Eslint,按照 Airbnb 的推荐语言规范。
输出正确的编译后代码到 NPM。
部署你的 storybook 到 Github Pages。
升级核心的构建工具(因此,你总会保持最新)
?: 好吧,那我该怎么开始?
很简单。安装 React CDK 只需下面这样:
npm install -g yo generator-react-cdk
若是你以前安装过 yo,你能够不安装。若是你不知道 yo 是什么,也不用担忧。
而后你能够建立一个项目:
yo react-cdk react-wizard
它会在react-wizard文件夹下生成一个项目和一系列文件。它是一个典型的React和其余工具配置的 NPM 模块。
全部的源代码文件都放在src文件夹下,这也是你须要关心的地方。你能够用你最喜欢的编辑器来编写src/index.js,开始开发一个组件。
?: 这些都不是什么新东西。咱们有一大堆的 yeoman 构建器和 React 脚手架。
是的!下面才是不同的地方。请继续阅读。
你老是须要一个示例 app 来测试你的组件。你能够用你本身的 app,可是应该有更好的解决方案。咱们最近发布了 React Storybook。它是解决这个问题的完美工具。
一个简单的命令:
npm run storybook
而后你就拥有了一个 storybook console, 来配置你的测试组件。
你能够在src/stories文件夹里 write stories了。
用这个方法,在组件开发时你就能够看到组件的样子。同时,你还能够虚拟的测试组件的各个状态。
React CDK 会使用最好的 JavaScript代码质量工具来配置你的项目。它推荐使用 Airbnb JavaScript style guide。它还配置了Enzyme 和 JSDOM 来作简单的 React 测试。
你甚至可使用一条简单的命令将你的 storybook 发布到 GitHub Pages。
了解更多的关于 React CDK 的信息,请访问这里。
不一样于其余的脚手架和构造器,使用CDK你能够用一条简单的命令来升级你项目中用到的工具。这意味着你彻底不用担忧构造工具的升级问题。让咱们 CDK 来担忧这个。
下面是升级的命令:
## update react-cdk npm install -g generator-react-cdk ## update your project ## First visit your component, then apply: yo react-cdk:update
这些命令会把你的组建的开发和构造工具升级到最新的版本。你彻底不用手动的去更新它们。
?: 这确实很棒,可是我能够按照个人须要来随意配置这些构建工具吗?
固然能够。咱们提供了一种方式,让你能够按照你想要的方式来配置你的构建工具。关于这个,你能够查看 configuration guide。
我但愿大家能够迸发不少很酷的想法而且分享你的很酷的项目(或者你公司)中的组件。
让咱们一块儿来分享它们到 React 社区。你们会喜欢它们的。咱们但愿 React CDK 可让这件事变得简单而且节省你的时间。
你也能够把你现有的组件整合进 React CDK 。你只须要把你源代码挪进来而且在package.json添加依赖便可。
我但愿了解大家如何使用React CDK,而且让咱们知道如何改进项目,使 CDK 变得更好。