React之旅-02 创建项目

创建React项目,常用的方式有两种:

bash 复制代码
npx create-react-app my-app
  • 使用Vite包,官网:https://vite.dev/。如需创建项目,请运行如下命令:
bash 复制代码
npm create vite@latest

经过对比分析,使用Vite包更加便利。故强烈推荐使用此方式。

Vite创建项目步骤,输入创建命令后,根据提示一步一步完成,首先输入项目名称(react-vite-app),然后选择框架(React),最后选择语言(TypeScript),当然,你完全可以根据自己的喜好进行选择。如下图:

创建完成后,进入项目目录,执行命令:npm install 安装依赖包,安装成功后,运行:npm run dev,开启Web服务器,如下图:

在浏览器地址栏中输入:http://localhost:5173,就可以看到预览界面了

至此,使用Vite包创建React项目,操作成功。使用VS Code 查看具体的项目文件。如下图:

项目文件的结构及各文件的说明,可以自行搜索,并可根据实际需要,对项目文件进行增、删、改。

相关推荐
风月说与山鬼39 分钟前
二、React入口文件(main.jsx)
前端·react.js
东风破_6 小时前
Docker 基础:为什么需要容器?
前端·后端·nginx
东风破_6 小时前
Docker 实战:使用 Nginx 作为容器入口代理 Node 服务
前端·后端·nginx
你别说话了7 小时前
Vue项目解决跨域
前端·javascript·vue.js
唐青枫7 小时前
http-server:别再双击 index.html,一条命令把目录变成网站
前端·javascript
网安蟹佬霸8 小时前
OSINT开源情报收集实战:从信息搜集到资产测绘(2026最新万字保姆级指南)
前端·网络·安全·web安全·网络安全·开源
a1117768 小时前
3D历史建筑展览馆 THreeJS 开源
前端·开源
单线程_018 小时前
【源码阅读】Vue3 Tokenizer 词法分析器完整状态机流转深度梳理(3.4+ 新版架构)
前端
PBitW8 小时前
PM 丢来 3 个 Excel、12 个功能、4 种情形?用 TRAE Work 30 分钟整理成前端开发文档
前端·trae
风骏时光牛马11 小时前
AIAgent高可用架构:弹性容错与故障自愈的落地实践
前端