React最佳实践系列 -- 探索嵌入式React应用

作者： DocWhite白先生

一. 嵌入式

1. 应用场景

作为前端开发，特别是企业级应用的开发，经常会遇到需要把你所开发的web应用嵌入到已经存在的系统中，这种时候如何不影响原系统正常运转并嵌入成为了一个难题。典型的，在以前如果通过jQuery编写web 组件的时候，这种嵌入问题并不是特别大的难题，只需要在网页中正确引入第三方类库的js，css。正常来说就能跑起来了。但是React的运行机制与以往不同，很多人特别是新手，如果都是通过create-react-app或者dva-cli来构建react项目，很多人可能只会让项目在当前的开发环境跑起来和打包。特别明显的就是，我带过很多新入坑的同学，他们仅仅知道在命令行输入npm start 或者npm run dev的时候就会能让react应用挂载到id为root或者app的dom节点上。
如果问他们怎么将这个应用挂载到别的系统中，如何实现时，肯定就会说在被集成的页面里面加一个id为root的div就好了，只要引入打包后的js和css，这个应用就能跑起来。
但事实上，由于不同系统所用技术架构的不同，在有的系统中这样做确实没问题，程序也确实能 自动 跑起来，这里我要强调 自动 两个字。因为所有的框架包括 facebook官方推出 create-react-app构建工具，在项目的入口文件（index.js）所做的操作都是

import React from 'react';
import ReactDOM from 'react-dom';