Vue3 + JS + pnpm 创建项目

发布时间:2026/11/8 20:22:01
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

关于本文作者

来自尧图内容编辑团队

尧图内容编辑团队 内容团队

尧图内容编辑团队

本文由尧图网络内容编辑团队执笔。团队由资深项目经理、前端工程师与设计师组成,所有内容均来自亲手交付的真实项目,先讲清问题、再给出可落地的解法。尧图深耕北京网站建设十年,服务过京华建材集团、智造科技等各行业客户,把一线经验沉淀为可复用的行业观察。

  • 十年建站经验,覆盖建材、制造、服务、文创等
  • 项目经理把关选题与事实准确性
  • 工程师与设计师联合撰写专业细节
  • 统一编辑规范,保证文风与排版一致
  • 每月复盘转化数据,迭代选题方向

延伸阅读

相关资讯与近期热门内容

深度阅读推荐

建站决策前值得细读的三篇

网站改版的5个关键决策
2024-08-12

网站改版的5个关键决策

什么时候该改版、改到什么程度、如何避免流量掉光,京华建材集团改版复盘给出答案。

获取专属建站方案

看完文章,把您的行业与预算告诉我们,免费获取一份量身定制的官网建设方案与报价。

立即免费咨询