说明和准备
最近在进行 react 前端，目标是想用 ant design 进行下个项目的前端开发，
然而事实上，我的前端经验还停留在 html+css+jquery 的阶段= =，react 或者 angularJs 什么的都完全没有接触过。但是既然是最新的技术，我们就应该有所了解才行
，公司给我的时间并不算长，三天的时间，所以我必须在这三天时间学习 react，以及能用 ant design 去开发前端，难度还是稍大，不过千里之行始于足下，大就大吧，总还是要学习的
接下来是准备
下载 node.js，我使用的是官网最新的 6.9.1 的 LTS 版本，也可以去 node.js 中文网中文网下载 4.4.4 的成熟版本
最好配置一个淘宝源 $ npm install -g cnpm --registry=https://registry.npm.taobao.org,命令行执行就可以了，之后的安装命令就可以直接使用 cnpm 代替本来的 npm
下载 React 的 js 包
开始
- 新建一个空项目（怎么新建就不说了，建目录也行，使用 idea 也行），然后将下载的 js 包丢到 build 目录下面
然后新建一个 study_1 文件夹，在文件夹下面新建一个 index.html 文件,注意最后一个 js 代码的 type
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../build/react.js"></script>
<script src="../build/react-dom.js"></script>
<script src="../build/5.8.38.browser.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">
ReactDOM.render(
<h1>Hello,world</h1>,
document.getElementById('example')
);
</script>
</body>
</html>
然后单击打开就能看到程序员的必经之路 233，接下来
2. 将 html 文件中的 js 文件单独移除来
2. 离线转换 es6 语法为 es5 语法，安装 babel 插件
npm install --global babel-cli
npm install babel-preset-react --save-dev
因为这里使用的是 es6，所以还需要安装 es2015
npm install babel-preset-es2015 --save-dev
然后使用命令:
babel -d result/ study_2/
然后...然后就是各种报错了，哈哈，首先会遇到的第一个报错是没有配置 es2015
经过百度，是因为没有配置到，这里需要我们在根目录创建一个 .babelrc 的文件
，在文件中添加代码：
{ "presets": [ "es2015", "react" ] }
然后再次运行转换命令，然后？毫无疑问，你又报错了。。这里因为当时 idea 卡在 index 命令，几个处理命令都丢失了，
但是其实原因其实很简单，有几个插件没有安装，把几个报错的插件安装好就行了，反复运行查看报错，找出几个插件，
统统使用 npm install ... 就 OK 了。
最后编译出来的文件在 result 文件夹中，你可以看到 index.js 文件，就可以拿来正常使用了。
这时我们就可以删除掉 browser.min.js 了，并且所有的 js 引用全部使用我们经常见到的 type="text/javascript" 了
排版改了几次 QAQ，markdown 语法跟我在 idea 中用的不一样
github 地址：https://github.com/Userwu/study_react
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于