使用vite创建一个react18项目

一、vite是什么?

vite 是一种新型前端构建工具,能够显著提升前端开发体验。它主要由两部分组成:

  • 一个开发服务器,它基于原生 ES 模块提供了丰富的内建功能,如速度快到惊人的模块热更新(HMR)。

  • 一套构建指令,它使用 Rollup 打包你的代码,并且它是预配置的,可输出用于生产环境的高度优化过的静态资源。

二、使用vite创建一个react18项目

  1. 执行指令。

    js 复制代码
    // npm
    npm create vite@latest

    使用 yarn 包管理器则执行以下指令:

    js 复制代码
    // yarn
    yarn create vite

    使用 pnpm 包管理器则执行以下指令:

    js 复制代码
    // pnpm
    pnpm create vite
  2. 输入项目名称。

  3. 选择React项目模板,空格按钮确认。

  4. 选择变种语言 TypeScript。

  5. 进入项目目录,执行 npm install 安装 node_modules,完成后,输入指令 npm run dev 启动程序。

  6. 项目目录。

三、使用react18技术栈(全家桶)中后台管理项目模板

相关推荐
FliPPeDround12 小时前
🚀 CRXJS v2.0正式版发布:Chrome扩展开发新体验
前端·浏览器·vite
爱看书的小沐1 天前
【小沐杂货铺】基于Three.JS绘制汽车展示Car(WebGL、vue、react、autoshow、提供全部源代码)
汽车·vue3·react·webgl·three.js·opengl·autoshow
拾光拾趣录3 天前
Vite 与 Webpack 热更新原理
前端·webpack·vite
20263 天前
11. vite打包优化
前端·javascript·vite
AverageJoe19913 天前
一次vite热更新不生效问题排查
前端·debug·vite
Crazy Struggle6 天前
.NET 9 + React 开发的企业级后台权限管理系统,文档齐全,轻松上手
react·权限管理系统·后台管理系统·.net 9.0
做梦都在学习前端7 天前
发布一个monaco-editor 汉化包
前端·npm·vite
前端进阶者8 天前
vite调试node_modules下面插件
前端·vite
天天鸭8 天前
写个vite插件自动处理系统权限,降低99%重复工作
前端·javascript·vite
Python私教9 天前
FastAPI+React19 ERP系统实战 第01期
react·fastapi