React学习(二):安装&环境搭建

时间:2020-9-9 作者:admin


序言:本篇介绍React下载安装以及环境搭建

目录

一、Nodejs安装

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境(运行js需要node.js)。因为React是JavaScript库,所以需要安装Node.js

1、下载node.js
可以去官网地址下载
React学习(二):安装&环境搭建

2、安装node.js
下载的.msi安装包,直接点击进行一步步安装
React学习(二):安装&环境搭建
3、安装验证
安装nodejs后,cmd打开命令提示符,通过命令来查看安装信息
node -v 查看nodejs版本
npm -v 查看npm版本
React学习(二):安装&环境搭建
注意:nodejs中含有npm,而npm是nodejs的包管理器(package manager)。
我们在Node.js上开发时,会用到很多别人已经写好的javascript代码(如Echarts.js等),如果每当我们需要别人的代码时,都根据名字搜索一下,下载源码,解压,再使用,会非常麻烦。于是就出现了包管理器npm。大家把自己写好的源码上传到npm官网上,如果要用某个或某些个,直接通过npm安装就可以了。

二、create-react-app安装

create-react-app 是一个全局的命令行工具。它会配置你的开发环境,以便使你能够使用最新的 JavaScript 特性,提供良好的开发体验,并为生产环境优化你的应用程序。你需要在你的机器上安装 Node >= 8.10 和 npm >= 5.6

//使用npm安装create-react-app
npm install -g create-react-app

三、创建/启动React程序

1、创建React应用程序
使用脚手架create-react-app快速创建一个命名为my-app的应用程序

//创建my-app项目
create-react-app my-app
//进入该项目
cd my-app

生成项目目录如下:
React学习(二):安装&环境搭建

2、npm start启动程序
进入程序目录,npm start就能启动该程序

npm start 

浏览器输入http://localhost:3000/查看-效果如下:
React学习(二):安装&环境搭建

四、编码工具VScode

网上很多编码工具,推荐使用Visual Studio Code,具备免费,开源,轻量,跨平台的特点,且十分好用,可以去官网地址下载
React学习(二):安装&环境搭建
左侧红框内-支持全目录显示、支持搜索、支持查看代码变更并对比、也有终端启动程序和提交代码。十分容易上手使用。
本文介绍react的安装、环境搭建和工具推荐等–请大家多多指教,能get到知识点不要忘了关注点个赞~。

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。