从 React 切换到 Nerv
Nerv 提供了比 React 更好的浏览器兼容性和更高的性能,与此同时也不会放弃 React 庞大的生态系统。兼容 React 生态系统是我们开发 Nerv 的重要目标之一。
假设我们有这样一段代码:
var React = require('react');
var ReactDOM = require('react-dom');
class MyComponent extends React.Component {
  render() {
    return <div>Hello World</div>;
  }
}
ReactDOM.render(<MyComponent />, node);
我们迁移的目标就是更改一些配置,但是不用改变代码本身任意一行。
目前支持的特性
react
- React.createElement
- React.cloneElement
- React.Component
- React.PureComponent
- React.Children
- React.isValidElement
- componentDidCatch (React 16)
react-dom
- ReactDOM.render
- ReactDOM.unmountComponentAtNode
- ReactDOM.findDOMNode
- ReactDOM.createPortal (React 16)
使用 Webpack
只需要在 alias 把 nervjs 和 react、react-dom 关联起来即可:
{
  resolve: {
    alias: {
      'react': 'nervjs',
      'react-dom': 'nervjs'
    }
  }
}
使用 Babel
直接单独使用 babel 需要安装一个叫 babel-plugin-module-resolver 的插件,接下来就在 .babelrc 添加以下内容,就可以把 react、react-dom 和 nervjs 关联起来:
{
    "plugins": [
        ["module-resolver", {
            "root": ["."],
            "alias": {
                "react": "nervjs",
                "react-dom": "nervjs"
            }
        }]
    ]
}
使用 Browserify
使用 Browserify 也需要安装一个叫 aliasify 的插件,然后在 package.json 把 react 和 react-dom 关联到 nervjs:
{
    "aliasify": {
        "aliases": {
            "react": "inferno-compat",
            "react-dom": "inferno-compat"
        }
    }
}