React 学习之路-基础项目搭建与环境配置

react

嗨，初次见面请多多指教，从React 的学习开始我的第一篇博客......

首先，需要安装node.js,直接在官网下载,拿走不谢 => node.js官网: https://nodejs.org/en/（选择合适你的电脑的版本），打开并安装程序，如图 =>

根据提示进行安装(npm管理工具会一起安装的)，安装完成以后，打开命令行，输入 node -v 和npm -v 来查看对应的版本号，若显示出恭喜你安装成功

接下来用npm 创建新的项目=>

首先利用npm 安装 create-react-app 工具，在命令行中输入： npm install -g create-react-app（安装全局的 create-react-app 脚手架工具）

其次选中指定文件夹使用命令创建新的react 项目： create-react-app my-new-app

等待......成功以后看到创建好的文件夹里目录结构如下：

1.node_modules 包含了react项目中会用到的一些组件

2. public 包含了项目的启动页面,也就是react工程的入口页面(打开项目时的首页)

3. src 包含了一些自己使用的css,js,img文件,index.js 是入口js,和index.html所对应

然后，在命令行中“ cd ”该目录,输入如下命令,部署npm，以及导入react-dom依赖包.

cmd中输入：

npm init （然后一路回车）

npm install --save react react-dom ( 在该目录下导入react和react-dom）

npm install --save react-router-dom （react路由，以后会用到）

npm 获取的时间有点长，建议使用淘宝镜像（淘宝 npm 地址： http://npm.taobao.org/）

淘宝镜像的使用方法：

1.临时使用 npm --registry https://registry.npm.taobao.org install express

2.持久使用 npm config set registry https://registry.npm.taobao.org

3.通过cnpm 使用 npm install -g cnpm --registry=https://registry.npm.taobao.org

最后通过 npm start 启动项目，浏览器自动弹出localhost:3000的网页窗口，如图：

好啦，开启React 的探索之路吧......