react+vite创建

要在本地初始化一个结合了React和Vite的项目,你可以遵循以下步骤:

1、安装Node.js:

确保你的机器上已安装了Node.js。如果未安装,请前往Node.js官网下载并安装。

2、使用终端或命令提示符:

打开你的终端(在macOS或Linux系统中)或命令提示符/PowerShell(在Windows系统中)。

3、创建新项目:

使用Vite提供的模板来创建一个新的React项目。运行以下命令:

js 复制代码
npm create vite@latest my-react-app -- --template react

或者如果你使用yarn作为包管理器,则运行:

js 复制代码
yarn create vite my-react-app --template react

这里的my-react-app是你想要创建的项目名称,你可以更改为任何你喜欢的名称。

4、进入项目目录:

创建完项目后,切换到项目目录中去:

js 复制代码
cd my-react-app

5、安装依赖:

在项目文件夹内,安装项目依赖:

js 复制代码
npm install

或使用yarn:

js 复制代码
yarn install

6、启动开发服务器:

使用以下命令启动本地开发服务器:

js 复制代码
npm run dev

或者如果你使用yarn:

js 复制代码
yarn dev

访问应用:

默认情况下,Vite将会在本地的3000端口启动应用程序(如果该端口已被占用,Vite会尝试使用下一个可用端口)。在浏览器中打开 http://localhost:3000 查看你的React应用。

这样你就完成了使用Vite和React初始化项目的基础设置,现在你可以开始开发你的React应用了。

相关推荐
苏武难飞1 分钟前
THREE.JS实现一个魔法镜子!
前端·css·three.js
小流苏生12 分钟前
工作十年了,慢慢学习敬畏死亡
前端·程序员·ai编程
xiaoxue..14 分钟前
react:浅聊 vdom 与 diff 算法
前端·javascript·react.js·面试
恋猫de小郭15 分钟前
Flutter 3.41.7 ,小版本但 iOS 大修复,看完只想说:这是人能写出来的 bug ?
android·前端·flutter
止语Lab19 分钟前
记忆溢出:当你的 Agent 记得太多时会发生什么
前端·javascript·vue.js
天天向上102420 分钟前
vue openlayers地图加载大量点位时优化
前端·javascript·vue.js
菩提小狗1 小时前
第42天:WEB攻防-PHP应用&MYSQL架构&SQL注入&跨库查询&文件读写_笔记|小迪安全2023-2024|web安全|渗透测试|
前端·安全·php
liuyouzhang4 小时前
将基于Archery的web数据库审计查询平台封装为jdbc接口的可行性研究(基于AI)
前端·数据库
码事漫谈9 小时前
大模型输出的“隐性结构塌缩”问题及对策
前端·后端
这儿有一堆花10 小时前
前端三件套真的落后了吗?揭开现代 Web 开发的底层逻辑
前端·javascript·css·html5