react开发环境准备

使用reactjs，我们有两种方式

一种是通过script标签引入reactjs，这是一种比较古老的编码方式了， 如果我们的项目比较大，你会对项目js进行拆分，然后页面就会通过script标签加载很多拆出来的js文件。这样的话，页面性能会很低，维护性也比较差

第二种是使用脚手架工具，这也是我们在学习的时候要使用的方式。那么什么是脚手架呢，可以这么理解，脚手架是前端开发过程中的一种辅助工具。他会自动帮我们构建一个大型项目的开发流程和目录，他允许我们以一定的方式去实现js的相互引用。让我们更方便的对项目进行管理，但是我们在脚手架里面写的代码实际上并不能直接运行。你需要脚手架工具帮我们做代码的编译，编译出来的代码才可以被浏览器识别运行。我们一般会使用grunt,gulp,webpack这样的工具来帮助我们编写脚手架。在开发的过程中我们其实不用太过关心脚手架的底层实现，只要学会使用他就可以了。能用reactjs产生的脚手架工具非常多，甚至公司内部都会有定制的脚手架工具。在初学reactjs的时候，我们可以使用官方提供的脚手架工具。叫做 create-react-app。首先是官方提供的脚手架工具，所以健壮程度不用怀疑。同时使用很简单，可定制性很强。调试代码也非常方便

https://reactjs.org/docs/create-a-new-react-app.html

这个地址，可以看到官方 Create React App 这个脚手架工具

 

npm install -g create-react-app
create-react-app my-app
cd my-app
npm start

看到npm就知道这是一个node的包管理工具，所以如果想使用这个工具就需要安装node 和 npm

如果node版本在6以上，npm版本在5.2以上，可以用下面这种方式

npx create-react-app my-app
cd my-app
npm start