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

相关推荐
之歆7 小时前
Vite 深度解析 - 重新理解现代前端构建工具
vite
禅思院7 小时前
探索Vite深入 Rollup 分块插件:从零实现一个智能分包工具
前端·前端框架·vite
一只小阿乐9 小时前
TypeScript中的React开发
前端·javascript·typescript·react
米丘11 小时前
Vite 代理跨域全解析:从 server.proxy 到请求转发的实现原理
javascript·node.js·vite
Java码农也是农12 小时前
ReAct vs Plan-and-Execute:哪种Agent架构更适合你的场景
react·plan+execute
这是个栗子1 天前
TypeScript(三)
前端·javascript·typescript·react
kyriewen1 天前
Vite:比Webpack快100倍的“闪电侠”,原理竟然这么简单?
前端·javascript·vite
曲幽1 天前
FastAPI + Vue 前后端分离实战:我的项目结构“避坑指南”
python·vue·fastapi·web·vite·proxy·cors·env
最初的↘那颗心1 天前
Prompt高级推理:COT思维链、Self-Consistency与ReAct模式实战
大模型·prompt·react·cot·思维链
Jenlybein2 天前
快速了解熟悉 Vite ,即刻上手使用
前端·javascript·vite