使用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技术栈(全家桶)中后台管理项目模板

相关推荐
进哥AI研习社12 小时前
构建工具链深度配置——Vite/SWC 与 Tree Shaking 调优
rollup·vite·构建工具·swc·代码分割·esbuild·tree shaking
PedroQue9916 小时前
v1.4.0:新增 defineUniPage 宏声明页面配置,架构全面重构
前端·vite
ylj_dev1 天前
从 0 构建 AI Workload Platform(九):真实场景、最小控制台与开源发布
go·react·开源项目·工作流·ai agent
xiaohe06011 天前
🤔 v-mortal 是什么?!我只知道 v-model 啊!
vue.js·vite·前端工程化
星辰徐哥2 天前
打破社媒营销信息差:具身交互智能打造全自动化KOL情报体系
运维·python·自动化·交互·react·数字人
Richown2 天前
Three.js 供应链三维可视化:全球物流轨迹、库存热力图与数字孪生的交互呈现
区块链·react
前端技术官2 天前
Web Components 为什么火不起来?
react·web components·ssr·shadow dom·custom elements
钛态2 天前
Vite 中的 CSS 工程化:从 CSS Modules 到 UnoCSS 的渐进式迁移
前端·vue·react·web
YIAN3 天前
告别等后端!React+Vite 前端独立开发全流程:接口封装 + Mock 方案 + 状态管理
前端·react.js·vite
PedroQue993 天前
@meng-xi/vite-plugin v1.3.0:generateUni 一键流水线
前端·vite