添加react到已存在的项目中(Adding React to an Existing Application)-1

将react功能添加到已有的项目中去，不必担心要重构你的项目。
你只需要按以下步骤：

1. 如果你的项目中没有package.json文件则在项目根目录敲：npm init，初始化一个配置文件，如果有则跳过这一步
2. npm install -p react react-dom先安装一个全局的react和react-dom(这步可做可不做)，然后，进入项目根目录安装npm install --save react react-dom这会将react和react-dom相关信息写到package.json配置文件中
3. 官方推荐使用babel来兼容es6和jsx语法。安装babel-preset-react和babel-preset-es2015，命令分别是：npm install --save-dev babel-cli babel-preset-react 和 npm install --save-dev babel-cli babel-preset-es2015
4. 在项目根目录配置.babelrc 文件，使项目能自动将es6或者jsx文件转换成js。进入项目根目录，创建.babelrc 文件：echo "a" > .babelrc
5. 配置.babelrc 文件:

{
  "presets": ["react","es2015"]
}

如果出现一下错误：
则表示presets引入的内容缺少或者不对。

1. 使用IDE配置filewatch，目的，检测文件的修改并自动转换react文件成普通js文件。配置方法见下面2图：
   
2. 配置结束后，只要检测到js文件，就会自动转换js文件。
3. 此时我们直接引用转换后的js文件：<script src="index-compiled.js"></script>，访问浏览器的时候，报错：，此时百思不得骑姐姐。。。看到下面一篇博客里面的一句话，豁然开朗：http://blog.youkuaiyun.com/github_26672553/article/details/52089523
   里面有这样一句话：**babel把引用部分编译成了require，而require在我们当前的es5中不能运行的。
   这时我们就要安装一个新工具webpack（最火的一款模块加载器简打包工具，它能把各种资源，例如js含”JSX”、coffee、样式含”less/sass”、图片等）**
4. 接着又准备使用webpack打包工具。。。。。。请看第二篇。。。。。。