创建一个react.JS项目

从零开始创建一个react.JS项目

  • 首先你需要安装node和npm,下面的教程是在有node与npm的基础上进行的。

1.创建文件夹 2.打开命令行,进入你创建的文件夹 3. npm init创建 package.jaon文件
创建时,生成新的package.json文件时,它会向用户提问一系列问题,如果你觉得不用修改默认配置,一路回车就可以了。
或者你可以用 npm init -f的命令创建 package.json文件,则默认跳过提问阶段.

4.安装各种依赖

npm install后面跟着--save命令,表示模块名将被添加到dependencies,可以简化为参数-S。

npm install后面跟着--save-dev命令,表示模块名将被添加到devDependencies,可以简化为参数-D。

devDependencies 里面的插件只用于开发环境,不用于生产环境,而 dependencies 是需要发布到生产环境的。

  • npm install --save react安装react
  • npm install --save react-dom安装React Dom,这个包是用来处理virtual DOM的。
  • npm install --save-dev webpack安装Webpack,现在最流行的模块打包工具。
  • npm install --save-dev webpack-dev-serverwebpack官网出的一个小型的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将会进行生产环境打包。


  1. 热加载:热加载意思是修改了文件之后不需要重启服务器就能看见修改的结果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值