[开源]一个优秀好用的前端解决方案,支持各种功能扩展和业务需求

科技一飞开源 2024-09-04 10:10:40

一飞开源,介绍创意、新奇、有趣、实用的开源应用、系统、软件、硬件及技术,一个探索、发现、分享、使用与互动交流的开源技术社区平台。致力于打造活力开源社区,共建开源新生态!

一、开源项目简介

一个优秀的前端解决方案

Fes.js 是一个好用的前端应用解决方案。Fes.js 以 Vue 3.0 和路由为基础,同时支持配置式路由和约定式路由,并以此进行功能扩展。配以覆盖编译时和运行时生命周期完善的插件体系,支持各种功能扩展和业务需求。

二、开源协议

使用MIT开源协议

三、界面展示

四、功能概述痛点

在开发一个前端项目之前,我们可能需要做如下准备工作:

搭建开发环境约定代码规范封装 API 请求配置路由实现布局、菜单、导航实现登录权限管理...

除了准备工作之外,还会遇到很多相似的业务类型,比如中后台应用大多都是工作台、增删改查、权限、图表等。如果每次项目都完全手动处理一遍,不仅耗费时间,久而久之可能会存在多种技术栈、开发规范,导致开发流程不统一,历史项目越来越难维护。所以我们需要一套完整的解决方案,管理开发到部署整个流程。

Fes.js 是什么?

Fes.js 是一个好用的前端应用解决方案。提供覆盖编译构建到代码运行的每个生命周期的插件体系,支持各种功能扩展和业务需求。以 路由为基础,同时支持配置式路由和约定式路由,保证路由的功能完备。整体上以约定、配置化、组件化的设计思想,让用户仅仅关心用组件搭建页面内容。基于 Vue.js3.0,充分利用 Vue 丰富的生态。技术曲线平缓,上手也简单。在经过多个项目中打磨后趋于稳定。

它主要具备以下功能:

快速 ,内置了路由、开发、构建等,并且提供测试、布局、权限、国际化、状态管理、API 请求、数据字典、SvgIcon 等插件,可以满足大部分日常开发需求。 简单 ,基于 Vue.js 3.0,上手简单。贯彻“约定优于配置”思想,设计插件上尽可能用约定替代配置,同时提供统一的插件配置入口,简单简洁又不失灵活。提供一致性的 API 入口,一致化的体验,学习起来更轻松。 健壮 ,只需要关心页面内容,减少写 BUG 的机会!提供单元测试、覆盖测试能力保障项目质量。 可扩展 ,借鉴 Umi 实现了完整的生命周期和插件化机制,插件可以管理项目的编译时和运行时,能力均可以通过插件封装进来,在 Fes.js 中协调有序的运行。 面向未来 ,在满足需求的同时,我们也不会停止对新技术的探索。已使用 Vue3.0 来提升应用性能,已使用 webpack5 和 vite 提升构建性能和实现微服务。五、技术选型插件

插件

介绍

@fesjs/plugin-access

提供对页面资源的权限控制能力

@fesjs/plugin-enums

提供统一的枚举存取及丰富的函数来处理枚举

@fesjs/plugin-icon

svg 文件自动注册为组件

@fesjs/plugin-jest

基于 Jest,提供单元测试、覆盖测试能力

@fesjs/plugin-layout

简单的配置即可拥有布局,包括导航以及侧边栏

@fesjs/plugin-locale

基于 Vue I18n,提供国际化能力

@fesjs/plugin-model

简易的数据管理方案

@fesjs/plugin-request

基于 Axios 封装的 request,内置防止重复请求、请求节流、错误处理等功能

@fesjs/plugin-vuex

基于 Vuex, 提供状态管理能力

@fesjs/plugin-qiankun

基于 qiankun,提供微服务能力

@fesjs/plugin-sass

样式支持 sass

@fesjs/plugin-monaco-editor

提供代码编辑器能力, 基于monaco-editor(VS Code 使用的代码编辑器)

@fesjs/plugin-windicss

基于 windicss,提供原子化 CSS 能力

@fesjs/plugin-pinia

pinia,状态处理

@fesjs/plugin-watermark

水印

@fesjs/plugin-swc

webpack构建中使用 swc-loader,构建速度蹭蹭蹭

像数 1, 2, 3 一样容易

使用 pnpm:

# 创建模板pnpm create @fesjs/fes-app myapp# 安装依赖pnpm i# 运行pnpm dev

使用 npm:

# 创建模板npx @fesjs/create-fes-app myapp# 安装依赖npm install# 运行npm run dev六、源码地址

访问一飞开源:https://code.exmay.com/

0 阅读:0