从零开始创建一个react.JS项目
- 首先你需要安装node和npm,下面的教程是在有node与npm的基础上进行的。
-
1.创建文件夹
2.打开命令行,进入你创建的文件夹
3.
-
创建时,生成新的package.json文件时,它会向用户提问一系列问题,如果你觉得不用修改默认配置,一路回车就可以了。
或者你可以用npm init -f
的命令创建package.json
文件,则默认跳过提问阶段.
npm init
创建
package.jaon
文件
4.安装各种依赖
npm install
后面跟着--save
命令,表示模块名将被添加到dependencies
,可以简化为参数-S。
npm install
后面跟着--save-dev
命令,表示模块名将被添加到devDependencies
,可以简化为参数-D。
devDependencies
里面的插件只用于开发环境,不用于生产环境,而dependencies
是需要发布到生产环境的。
npm install --save react
安装reactnpm install --save react-dom
安装React Dom,这个包是用来处理virtual DOM的。npm install --save-dev webpack
安装Webpack,现在最流行的模块打包工具。npm install --save-dev webpack-dev-server
webpack官网出的一个小型的express服务器,主要特性是支持热加载1.npm install --save-dev babel-core
安装Babel,可以把ES6转化为ES5。但是目前react只支持ie11+的浏览器。- 打开
package.json
文件,然后添加下面的script:
"script":{
"start":"webpack-dev-server --hot --inline --colors --content-base ./build",
"build":"webpack --progress --colors"
}
命令行输入npm start
就是启动webpack dev server
命令行输入npm build
将会进行生产环境打包。
- 热加载:热加载意思是修改了文件之后不需要重启服务器就能看见修改的结果。 ↩