reactjs实战（1）搭建 webpack + React 开发环境

闲话少说，直接开撸代码

初始化环境

首先保证 node 和 npm 环境，运行 node -v 和 npm -v。

如果环境已存在，进入项目目录，运行npm init 生成 package.json，所用的项目使用npm做依赖，package.json中描述了该项目的信息以及一些第三方依赖（插件）,详细的使用说明可查阅官网文档，不过是英文的。

安装插件

webpack需要插件进行支撑，运行npm install webpack webpack-dev-server --save-dev来安装两个插件。

安装React环境，也需要插件进行支撑，运行npm i react react-dom --save来安装两个插件，其中i是 install的简写。

安装完成之后，package.json 可以看到多了devDependencies和dependencies两项，根目录也多了一个node_modules文件夹。

--save 和 --save-dev 的区别

使用--save和--save-dev，可分别将依赖（插件）记录到package.json中的 dependencies和 devDependencies下面。

dependencies下记录的是项目在运行时必须依赖的插件，常见的例如react jquery等，即及时项目打包好了、上线了，这些也是需要用的，否则程序无法正常执行。

devDependencies下记录的是项目在开发过程中使用的插件，例如这里我们开发过程中需要使用webpack打包，而我在工作中使用fis3打包，但是一旦项目打包发布、上线了之后，webpack和fis3就都没有用了，可卸磨杀驴。

延伸一下，我们的项目有package.json，其他我们用的项目如webpack也有package.json，见./node_modules/webpack/package.json，其中也有devDependencies和dependencies。当我们使用npm i webpack时，./node_modules/webpack/package.json中的dependencies会被 npm 安装上，而devDependencies也没必要安装。