之前在官网看到使用script进行引用的方式进行react的开发，包括在一些简单项目中，我也是引用过来后进行开发的，前期简单的使用是为了了解react的思想，在进入大的项目之前首先需要配置一个更完整的项目环境。
npm是现在比较常用的包管理工具
1、项目配置初始化
|
1 |
npm init |
进入一系列的命名确认流程，可写可不写，使用默认的就行，package name 可以给一个名字，目录下生成一个package.json文件
2、安装react
|
1 |
sudo npm install --save react react-dom babelify babel-preset-react |
3、 独立安装ES2015
|
1 |
sudo npm install --save babel-preset-es2015 |
–save 可以把下载到的包的配置添加到package.json中，方便后期的查看和包管理
然后就开始在文件夹中建立index.html和src/index.js，并在html引用，但实际上这里跟之前直接在html中写js的时候不一样，可以直接加type=“text/babel”，而现在需要用webpack打包一下再引用.
|
1 2 3 4 5 6 7 |
var React = require('react'), ReactDom = require('react-dom'); ReactDom.render( <h1>hello word</h1>, document.getElementById('example') ) |
4、安装webpack
|
1 2 3 |
npm install -g webpack npm install -g webpack-dev-server //安装webpack运行的服务器 |
5、在当前目录下进行安装，保存配置
|
1 2 3 |
npm install webpack --save sudo npm install webpack-dev-server --save |
6、进入目录执行：webpack
按理来说是应该可以执行的，但是报错，babel-core的作用是调用Babel的API进行转码，暂时不管具体怎么用，既然报错就安装就好了
之后再执行就正常，打开浏览器预览，成功