如何创建react项目

简介: 如何创建react项目

在那个盘创建都可以,推荐E盘或者D盘

在E盘下创建一个文件夹,文件夹什么名字都可以,随便起

我创建的react

点进去

在这输入cmd

输入完按回车

出现命令行

在里面输入指令

npx create-react-app my-app

创建项目 前面固定格式 后面名称随便起

cd my-app

选择项目 cd是选择 后面是项目xxx

最后

输入npm start是启动

输入完回车等一会会变成这样

这个时候就已经在浏览器启动了,当然也就代表创建成功了。

整个流程下来创建成功,在浏览器启动结束,当然这一点完成后把他关闭掉就好了,用代码编译器打开就好了。

详情请接着往下看

最后在代码编译器打开就可以编写代码了,是的没错就是这样

小编用的vscode

用编译器打开

可以删除一些不怎么用的,比如图标,图片之类的,当然不删除也行。

打开

这个是小编的---配置好的

按需创建

在src文件夹的下面创建一个router.js文件用于配置路由

在src文件夹的下面创建一个views文件夹用于放置自己的jsx文件

两边要对照

看图片左边框起来的就是创建的文件

右边import就是将他导入到里面

下面的就是用let创建一个变量,开始配置按照这个格式写就好了

最后的这个非常重要,没有他就报错,见下面这段,也是上面图片最后一点没有框起来的那一点。

export default routes;

这是一个页面

 

然后到这里本篇文章就完毕了,谢谢观看,有好的建议可以在评论区发出来。

目录
相关文章
|
前端开发 JavaScript 测试技术
从零开始搭建react+typescript+antd+redux+less+vw自适应项目
从零开始搭建react+typescript+antd+redux+less+vw自适应项目
329 0
|
前端开发 API 数据安全/隐私保护
【第45期】一文解决React项目的权限管理
【第45期】一文解决React项目的权限管理
530 0
|
Web App开发 资源调度 JavaScript
竟然可以在一个项目中混用 Vue 和 React?
竟然可以在一个项目中混用 Vue 和 React?
1135 0
|
运维 JavaScript 前端开发
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
204 2
|
存储 JSON 前端开发
react保姆级搭建新项目
此文主要以ts+vite+router6+antd 快速搭建一个react项目,适用于初学者,用于学习交流
284 2
|
移动开发 JavaScript 前端开发
vue/react项目刷新页面出现404的原因以及解决办法
vue/react项目刷新页面出现404的原因以及解决办法
1052 0
|
存储 资源调度 前端开发
【React | 完整项目创建流程】能看到这么详细的React配置流程,就偷着乐吧!
【React | 完整项目创建流程】能看到这么详细的React配置流程,就偷着乐吧!
348 1
|
前端开发 JavaScript API
Github 上 8 个很棒的 React 项目
Github 上 8 个很棒的 React 项目
5219 0
|
前端开发 开发工具 git
React项目包结构的作用
React项目包结构的作用
239 0
|
前端开发
React 中 react-i18next 切换语言( 项目国际化 )
React 中 react-i18next 切换语言( 项目国际化 )
933 0