vue-element-admin 宝塔安装实录

超哥 — Tue, 23 Sep 2025 10:47:48 +0000

最近由于想创建系统的需要，也经过网上的评测，决定安装vue-element-admin来做个项目，选择vue-element-admin的原因就是性价比很高，网上有很多的资料和教程，虽然没有一些商业化的界面高大上，但是作为人气最高的后台管理系统，大家说好才是真的好。

为什么要记录一下呢，每个人了解的知识的侧重点不同，所以在记录使用开发上，偏重的问题也不同，所以说这次作为个人角度的记录，对自己是学习，对大家来说，换个角度来解决问题。

本地化部署太麻烦，而且本地化的node版本会比服务器上的高很多，无论后期的版本匹配之类都会出现bug，所以直接就开个服务器直接运行测试。这次选用的是阿里云的。直接选择宝塔面板，一键安装很方便。

安装好之后就是软件商店，安装Node.js版本管理器 2.7，Nginx 1.26.1，mysql5.7。和之前担心的一样，大家都会建议安装稳定版本，无须图快，没有几年的纠错能力，最新版本最好不要碰。

下一步在终端里安装git。

yum install git

然后克隆项目：

# 克隆项目
git clone https://github.com/PanJiaChen/vue-element-admin.git

#多语言版本

git clone -b i18n git@github.com:PanJiaChen/vue-element-admin.git

#国内地址
git clone https://gitee.com/mirrors/vue-element-admin.git

#进入目录

cd 目录

#安装依赖

npm install

#进入目录

cd 目录

#开发模式

npm run dev

#上线优化

npm run build

但是宝塔的node项目管理并不友好，有的时候环境和模块指定不上去。这里可以利用git来重新安装环境和模块。

默认安装的英文版本，如何改变成中文的版本呢？

使用 i18n 分支就有语言功能，直接是四种语言切换，虽然平时用不上，但是看起来蛮高大上。

如何启动和打包

#查看可用命令

npm run

# vue-element-admin 版本（4.3.1）在 package.json 里 可用的脚本

dev → vue-cli-service serve
build:prod → vue-cli-service build
build:stage → vue-cli-service build --mode staging
preview → node build/index.js --preview

#开发模式

npm run dev

#生产模式打包

npm run build:prod

#预览打包

npm run preview

不过后来觉得太麻烦了，直接上了集成好的fastadmin，而且他们的插件生态圈子很多，部署起来和商用也很及时。参考文档：https://doc.fastadmin.net/

fastadmin – 超哥工作室

vue-element-admin 宝塔安装实录

如何启动和打包