使用React搭建初始化环境（React入门）

2024-05-09 10:55:38

使用VSCode编辑器搭建React的基础使用环境(Visual Studio Code官方下载地址)

一、搭建React使用环境

1.检查是否安装React包

在任意位置打开命令窗口

输入命令：

    npm list -g --depth=0

如果有下面这个包的话标明已经安装好React了，可以直接跳过安装进入创建环节，如果没有可以可以按照以下步骤安装

2.安装React

在命令窗口输入：

    npm i create-react-app -g

注意由于服务器是在国外，速度会较慢，而且容易丢包，建议使用科学上网或者使用阿里的提供服务器下载,即以下代码

    cnpm i create-react-app -g

出现一下代码即安装成功

3.安装VSCode上运行React的相关插件

安装好VSCode后，打开软件

在插件中搜索ES7

第一个ES7 React/Redux/GraphQL/React-Native snippets就是运行React的运行插件，点击安装，安装好后重启VSCode。

二、创建

1.创建react

在命令窗口输入：

    create-react-app first-react-project（项目名称）

出现以下代码即创建成功

将命令窗口切换至项目文件夹，输入运行命令

    npm start

如果没有报错，React项目运行成功

如果报错，将项目文件中的node_modules文件删除，然后在项目所在文件打开命令框，重新安装React环境React默认端口号为3000，打开浏览器，在地址窗口输入localhost：3000出现一下窗口，即React初始化环境搭建完成

转载于:https://juejin.im/post/5c20c58e51882521eb44bd49

使用React搭建初始化环境（React入门）相关推荐

用Jenkins自动化搭建测试环境_入门试炼06
本章研发修改程序代码. 运行Jenkins环境发布任务.新环境上验证研发更改. 实战 1. 修改部署应用源代码 2. commit修改内容,push代码到github 3.执行Jenkins自动化部署 ...
用Jenkins自动化搭建测试环境_入门试炼05
Jenkins自动化部署任务开发: 本章简述自动化构建.部署过程. 创建Jenkins 任务,填写部署代码.实际运行部署任务. 一.部署过程介绍简述自动化部署过程: [开始]-[Git同步最新代码] ...
【停车场车辆管理系统】从零搭建——前端react搭建
[停车场车辆管理系统]从零搭建--项目分析 [停车场车辆管理系统]从零搭建--数据库搭建 [停车场车辆管理系统]从零搭建--后端搭建 [停车场车辆管理系统]从零搭建--后端Model类 [停车场车辆管 ...
react安装_「React实战」三分钟搭建React开发环境
其实16年的时候就已经接触到React,那个时候也只是入门,时隔多年,工作上一直都没有接触到相关的业务,不知不觉,前端的天也开始渐变,看到了很多招聘要求上都是要求会React,三大框架怎么也得熟悉使 ...
在windows上搭建React Native开发环境
最近要学习React Native,但是在window上搭建开发环境的时候遇到了些问题,以至于一直没有搭建好开发环境. React Native相关项目及文档: react-native的GitHub ...
从零搭建webpack的react开发/生产环境
一.初始化项目在命令行中敲入如下命令: mkdir Webpack-react && cd Webpack-react && npm init -y 然后你就可以在你 ...
React Native学习笔记一之搭建开发环境
因为项目需要,今天开始正式学习React Native,先来搭建个开发环境忐忑的心情因为项目比较急,而且客户要求使用React Native开发,只能先学点基础然后在项目中使用的时候,边做边学了, ...
React实践（一）——webpack4搭建开发环境
github 1.创建基本目录结构 npm init 创建src文件夹,再其中新建index.html 安装webpack依赖: npm install webpack webpack-cli web ...
React系列---Webpack环境搭建（二）不同环境不同配置
React系列---Webpack环境搭建(一)手动搭建 React系列---Webpack环境搭建(二)不同环境不同配置 React系列---Webpack环境搭建(三)打包性能优化实际项目中,往 ...

最新文章

热门文章