简单搭建react开发环境

简介: 提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录 目录 前言 一、pandas是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言安装前需要安装:node.js、vscode一、node.js使用运行Node.js command prompt,输入命令: npx create-react-app my-app (如下图)安装完成截图如下:至此,react安装完成,可以直接在npom控制台运行,我放到v..

前言

安装前需要安装:node.js、vscode

一、node.js使用

运行Node.js command prompt,输入命令: npx create-react-app my-app (如下图)

请在此添加图片描述
安装完成截图如下:

请在此添加图片描述

至此,react安装完成,可以直接在npm控制台运行,我放到vscode运行了

二、vscode

1.打开文件

打开文件夹,即之前npm安装的目录(我是这个目录)
请在此添加图片描述

2.运行

ctrl+`打开终端,输入yarn start运行react

yarn start

运行完成自动打开浏览器。

3. 第一个react程序,从helloworld写起

ReactDOM.render(
  <h1>Hello,World!</h1>,
  document.getElementById('root')
);

具体如下图:

请在此添加图片描述
运行完成,效果如下图
请在此添加图片描述

总结

至此,可以使用vscode开发react了,第一个react程序完成。欧耶(^o^)/

以上就是简单搭建react开发环境的介绍,做此记录,如有帮助,欢迎点赞关注收藏!

目录
相关文章
|
资源调度 前端开发 JavaScript
三分钟搭建React开发环境
三分钟搭建React开发环境
421 0
|
资源调度 前端开发 JavaScript
从零开始学习React-开发环境的搭建(一)
从零开始学习React-开发环境的搭建(一)
74 0
|
前端开发 应用服务中间件 API
解决分布式React前端在开发环境的跨域问题
解决分布式React前端在开发环境的跨域问题
200 0
|
JSON 前端开发 数据格式
从零搭建 Vite + React 开发环境 #112
从零搭建 Vite + React 开发环境 #112
306 0
|
前端开发
antd组件库封装23-配置react开发环境
antd组件库封装23-配置react开发环境
142 0
antd组件库封装23-配置react开发环境
|
Web App开发 前端开发 JavaScript
webpack手动配置React开发环境
React提供了create-react-app的快速构建工具, 但作为一个专业的程序员(老司机), 面对复杂的项目, 入门级的构建工具, 是远远不够的, 我们这里从零开始, 用webpack, 手动配置一个独立的React开发环境, 开发环境完成后, 支持自动构建, 自动刷新, sass语法 等功能.
1147 0
React-native 开发环境配置(win版本)
搭建开发环境 1、首先下载node.js 下载链接:https://nodejs.org/zh-cn/ ; 2、安装node.js; 3、安装完成,运行打终端输入:nmp -v 显示node.
1157 0