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应用了。

相关推荐
坐而论道_12 分钟前
兼容低版本 Android:让现代 Web 应用在旧 WebView 上稳定运行
前端·面试
ssshooter32 分钟前
Promise 和 async/await 被 try-catch 包裹时的行为差异
前端·javascript·面试
肖志-AI全栈37 分钟前
从零讲透 Ajax:XHR、Fetch、JSON 序列化到异步编程全链路
前端·ajax·json
yyt36304584140 分钟前
KlineChartQuant Tooltip 高频交互 200FPS 性能优化完整复盘
前端·经验分享·性能优化·typescript·vue·交互·chrome devtools
2601_963771371 小时前
WordPress SEO Guide: Boost Rankings Without Technical Jargon
前端·php
李顿波1 小时前
Chrome 扩展程序 MV3 架构组件概览
前端·chrome·浏览器插件
KingCodeHan1 小时前
ESLint 完全指南:从入门到精通
前端
GHL2842710902 小时前
安装chrome浏览器
前端·chrome
谙忆10242 小时前
WebCodecs 实战:用 ImageDecoder 和 VideoFrame 在浏览器里做硬件加速的帧处理
前端
JerrySir2 小时前
密码没泄露,2FA 也没失效:Chrome 146 为什么还要让 Cookie“搬不走”?
前端