Vue3 + JS + pnpm 创建项目

Vue3 + JS + pnpm 创建项目 Vue3 JS pnpm 创建项目一、创建项目1. 使用 pnpm 创建 vue 项目打开终端Windows 下推荐使用 PowerShell 或 CMDmacOS/Linux 使用自带的 Terminal执行下面的命令来初始化一个 Vue3 项目pnpm create vuelatest执行后命令行会进入交互式问答界面依次询问项目名称、是否启用 TypeScript 等选项。这里我们统一选择 JavaScript不是 TS其余选项按下面的清单勾选即可✔ Project name: › vue3‑ruoyi‑admin ✔ Add TypeScript? … No ✔ Add JSX Support? … No ✔ Add Vue Router for Single Page Application development? … Yes ✔ Add Pinia for state management? … Yes ✔ Add Vitest for Unit testing? … No ✔ Add an End‑to‑End Test Solution? … No ✔ Add ESLint for code quality? … Yes ✔ Add Prettier for code formatting? … Yes所有选项确认后脚手架会自动生成项目目录和基础文件并提示后续操作步骤。此时项目骨架已经搭建完成接下来进入依赖安装与启动环节cd vue3‑ruoyi‑admin pnpm install pnpm run dev在浏览器中访问 http://localhost:5173如果能看到 Vue 官方默认的欢迎页面说明项目已经成功跑起来了。这个默认页面虽然简单但它验证了从创建、安装依赖到启动的整条链路都是通的后续我们就在这个基础上开始仿若依的改造。2. 安装依赖包仿若依必备项目跑通后接下来安装仿若依后台管理必备的依赖包。这些包分别负责 UI 组件、网络请求、图标和样式预处理是后续搭建布局和权限体系的基础#element-plus UI库pnpm add element-plus#axios请求库pnpm add axios#icon图标elementplus图标pnpm add element-plus/icons-vue#scss样式pnpm add-D sass# 运行时依赖 pnpm add vue-router4pinia element-plus axios#unplugin按需导入插件开发依赖-Dpnpm add-D unplugin-vue-components unplugin-auto-import