插件集合

classsnames

用来处理css类

core-decorators/Trait

处理类或者类方法修饰

Immutable

不可变对象

react-addons-create-Fragment

有两个子组件要渲染时,我们没法给他们设置key,需要用到这个插件。P110。

react-addons-perf

性能检查工具。

react-smooth

动画(CSS动画,JS动画)

react-motion

这也是一个比较有意思的动画库,写法类似css的多关键帧动画。并且几种缓动函数动画这里都能实现。

vivus

最出名的SVG动画插件

MTUI

UI库

hoist-non-react-statics

复制react组件的静态方法

redbox-react

The red box (aka red screen of death) renders an error in this “pretty” format:

http://npm.taobao.org/package/redbox-react

http://npm.taobao.org/package/redbox-react

babel-plugin-react-transform

这个插件通过任意转换的方式去封装 React 组件。换句话说,你可以随心所欲的摆弄你的组件了。

babel-plugin-transform-runtime

在 Babel 转换过程中,详细的展示引用的相关辅助工具和内置命令,并自动的聚合填充你的代码而不会污染全局。

babel-plugin-transform-decorators-legacy

用于babel5 用户的过渡

react-transform-catch-errors

A React Transform that catches errors inside render() function and renders a React component with an error message instead.
It’s up to you to choose the React component to render an error message. For example, you may use redbox-react that imitates React Native “red screen of death”.

它依赖于babel-plugin-react-transform

react-transform-hmr

A React Transform that enables hot reloading React classes using Hot Module Replacement API. Hot module replacement is supported natively by Webpack and available in Browserify with browserify-hmr.

它依赖于babel-plugin-react-transform

react-immutable-render-mixin

This library when used as a mixin/decorator replaces the PureRenderMixin when using facebook/immutable-js library with React

This Mixin and HoC implements shouldComponentUpdate method using prop and state equality with Immutable.is().

We also expose the shallowEqualImmutable to allow developers to craft a custom shouldComponentUpdate method as needed.

react-css-modules

CSS模块化

immutable

http://facebook.github.io/immutable-js/

react-motion

https://www.npmjs.com/package/react-motion

react-addons-create-fragment

如果有多个子组件要渲染,我们没法给它们设置key,这时就需要用这个插件来解决了:

import React form 'react';
import createFragment from 'react-addons-create-fragment';

function Rank({first,second}{
    const children = createFragment({
	    first:first,
		second:second
	});
	
	return (
	    <ul>{children}</ul>
	);
})
posted @ 2017-11-13 20:32  禅楼望月  阅读(404)  评论(0编辑  收藏  举报