🤔前端Admin基础框架需要哪些功能

题记

本文不推荐任何技术栈，仅仅从业务和系统的角度去思考一个前端Admin基础框架需要哪些功能

由来

在抖音或者公众号的技术帖子中，比较常见的就是前端Admin框架推荐，大厂或知名的如 Acro Pro, Element Admin，Antd Pro, iView Admin等，基本上主流的UI框架都会配套一个开源Admin系统。中规中矩的登录页面，充满屏幕的菜单列表，眼花缭乱的dashboard等等这些功能。如果直接用在项目中，却还是需要删除不少东西的。在对接多个项目，以及自己在公司中搭建过多次Admin框架（小团队没有固定的UI，哪个舒服就换哪个），总结一下一个前端Admin框架需要的最基础东西是哪些，为此写一下心得感悟。

功能清单

image.png
实操下来，确定好编码规范，通用请求，权限体系即可

编码规范

1. 确定好目录结构，api, types, routes, pages, config等等。因此像Nuxt, Next 这种框架，就很赞，约定好了很多规范，很值得参考。
2. 编码格式，不用多说， eslint需要增加。如果影响了效率，去掉吧，直接开撸就行，能持续做下去的项目没那么多的。
3. 提交规范，husky引入，与上面的编码规范相辅相成，利用git的hooks功能做自动化的保障。但是很多人其实提交的内容都是 recently update。

通用请求

强烈建议用基础JS或TS打包成一个通用方法，数据请求就这些东西，切换框架就直接复制粘贴即可

权限体系

这一块和实际公司业务有关系，会涉及到和后端的数据做交互的。但基本上业务会包含

1. 登录 / 登出
2. 路由菜单
3. 管理员权限
4. 个人账号设置

其中路由菜单是较为复杂，包含的内容比较多，但技术栈基本上就是 状态管理 + 持久化 来实现，这一块也建议单独打包处理，这样公司中项目升级，可省去很多事。

其他的内容，就是当要新起项目的时候，可以一并继承过来的功能，这部分的代码是重复且冗余的，后端涉及到的逻辑也多，测试也麻烦，但是又是基础设施。

总结

实现上述三大块业务后，基本上新起一个admin项目就是 install 的事情，而且是切合公司实际业务的，从零开始的话，周期可能一周左右吧。