diff --git a/README.md b/README.md index 84388e9..0633836 100644 --- a/README.md +++ b/README.md @@ -1,37 +1,54 @@ # RuoYi-App-Geek + +
+ logo + + + logo +
+

RuoYi-Geek v3.8.7.3.2

+

基于SpringBoot3+Vue3前后端分离的Java快速开发框架

+

+ +

+ # 引言 -RuoYi-Vue与RuoYi-App是基于SpringBoot2+Vue2打造的企业级开发框架，得到了广大开发者的喜爱和积极反馈。随着技术的迭代进步，SpringBoot3与Vue3逐渐进入开发者的视野。为了满足开发者对于新技术的追求，RuoYi官方文档提供了SpringBoot2至SpringBoot3的升级方法。与此同时，社区也涌现出了RuoYi-Vue3、RuoYi-App-Vue3的版本，展现了开发者社区对于技术升级的热情与努力。 -然而，在升级的过程中，官方的方法为了兼顾Java1.8的特性与一些老旧的方法，未完全拥抱**SpringBoot3与Java17**的全部特性。而社区的RuoYi-Vue3、RuoYi-App-Vue3版本由于出自不同的团队之手，**兼容性及整合性**上存在些许**不足**。更为关键的是，尽管这些版本**支持TypeScript**，但**缺乏与之相匹配的tsconfig.json配置文件**，这使得在主流编辑器如VSCode中，TypeScript的语法提示环境并未达到最佳状态。 +RuoYi-Vue 与 RuoYi-App 是基于 SpringBoot2+Vue2 打造的企业级开发框架，得到了广大开发者的喜爱和积极反馈。随着技术的迭代进步，SpringBoot3 与 Vue3 逐渐进入开发者的视野。为了满足开发者对于新技术的追求，RuoYi 官方文档提供了 SpringBoot2 至 SpringBoot3 的升级方法。与此同时，社区也涌现出了 RuoYi-Vue3、RuoYi-App-Vue3 的版本，展现了开发者社区对于技术升级的热情与努力。 -鉴于此，**RuoYi-Geek生态**应运而生。它旨在为广大开发者提供一个既保留原版本核心特性，又整合社区版优点的全新解决方案。在**RuoYi-Geek**中，我们深入调研了企业开发中常用的RuoYi扩展，并直接在框架中集成，确保开发者能够快速上手，高效开发。同时，我们采用了最新的**SpringBoot3+Vue3**技术栈，彻底移除了为了兼容Java1.8而保留的老旧方法。更为重要的是，我们为TypeScript开发环境加入了常用的tsconfig.json配置，使得开发者在VSCode等编辑器中能够获得更为舒适、便捷的语法提示体验。 +然而，在升级的过程中，官方的方法为了兼顾 Java1.8 的特性与一些老旧的方法，未完全拥抱**SpringBoot3 与 Java17**的全部特性。而社区的 RuoYi-Vue3、RuoYi-App-Vue3 版本由于出自不同的团队之手，**兼容性及整合性**上存在些许**不足**。更为关键的是，尽管这些版本**支持 TypeScript**，但**缺乏与之相匹配的 tsconfig.json 配置文件**，这使得在主流编辑器如 VSCode 中，TypeScript 的语法提示环境并未达到最佳状态。 -**RuoYi-Geek**不仅仅是一个简单的升级版本，更是对于RuoYi生态的一次全面优化与整合。我们相信，通过**RuoYi-Geek生态**，开发者将能够更为高效、愉悦地开发出优秀的企业级应用。 +鉴于此，**RuoYi-Geek 生态**应运而生。它旨在为广大开发者提供一个既保留原版本核心特性，又整合社区版优点的全新解决方案。在**RuoYi-Geek**中，我们深入调研了企业开发中常用的 RuoYi 扩展，并直接在框架中集成，确保开发者能够快速上手，高效开发。同时，我们采用了最新的**SpringBoot3+Vue3**技术栈，彻底移除了为了兼容 Java1.8 而保留的老旧方法。更为重要的是，我们为 TypeScript 开发环境加入了常用的 tsconfig.json 配置，使得开发者在 VSCode 等编辑器中能够获得更为舒适、便捷的语法提示体验。 -本项目为**RuoYi-Geek生态**的 RuoYi-App部分。 +**RuoYi-Geek**不仅仅是一个简单的升级版本，更是对于 RuoYi 生态的一次全面优化与整合。我们相信，通过**RuoYi-Geek 生态**，开发者将能够更为高效、愉悦地开发出优秀的企业级应用。 + +本项目为**RuoYi-Geek 生态**的 RuoYi-App 部分。 **注意：** 本人的其他两个推荐搭配的项目 -1. [Ruoyi-SpringBoot3-Geek: 这是若依极客生态的后端Springboot3版本 (gitee.com)](https://gitee.com/geek-xd/ruoyi-spring-boot3-geek) -2. [RuoYi-Vue3-Geek: 这是若依极客生态的Vue3版本 (gitee.com)](https://gitee.com/geek-xd/ruo-yi-vue3-geek) -**与Ruoyi-App相比较** -1. 使用UniApp+Vue3的最新框架 -2. 支持TS、SCSS、LESS等对js和css的扩充语言 -3. 使用Pinia代替Vuex，更加轻巧简单 -4. 使用uView-Plus（好看的ui） 代替uView-ui的ui组件库 -5. 使用uCharts（方便的图表）画图工具 +1. [Ruoyi-SpringBoot3-Geek: 这是若依极客生态的后端 Springboot3 版本 (gitee.com)](https://gitee.com/geek-xd/ruoyi-spring-boot3-geek) +2. [RuoYi-Vue3-Geek: 这是若依极客生态的 Vue3 版本 (gitee.com)](https://gitee.com/geek-xd/ruo-yi-vue3-geek) + +**与 Ruoyi-App 相比较** + +1. 使用 UniApp+Vue3 的最新框架 +2. 支持 TS、SCSS、LESS 等对 js 和 css 的扩充语言 +3. 使用 Pinia 代替 Vuex，更加轻巧简单 +4. 使用 uView-Plus（好看的 ui） 代替 uView-ui 的 ui 组件库 +5. 使用 uCharts（方便的图表）画图工具 6. 已经完成了分包操作 7. 提供了颜色选择器、二维码等常用组件 8. 将原有内置工具进行类型标定 -9. 分别提供了uview-plus和ucharts的模板（可以直接使用或者用于学习） +9. 分别提供了 uview-plus 和 ucharts 的模板（可以直接使用或者用于学习） + # 快速开始 -**注意：**node版本需要16+ + +**注意：**node 版本需要 16+ ## 安装 一下三种方式均可，感觉速度 pnpm > yarn > cnpm > npm -***Vue3/Vite版要求 node 版本^14.18.0 || >=16.0.0*** +**_Vue3/Vite 版要求 node 版本^14.18.0 || >=16.0.0_** ```shell npm install @@ -44,26 +61,25 @@ pnpm install 1. 将项目下载到本地 2. 初始化项目---进入项目根路径运行指令初始化项目 -```npm install``` -4. 运行项目---进入项目根路径运行指令（在package.json能找到所有指令）： -以微信小程序为例：```npm run dev:mp-weixin``` -以H5为例``` npm run dev:h5``` -7. 查看项目 以微信小程序为例： -打开微信开发者工具，导入项目路径 dist\dev\mp-weixin -以H5为例：打开浏览器，输入控制台输出的地址 -注：公众号属于H5，以微信公众号为例，打开微信开发者工具，输入控制台输出的地址 -9. 打包项目---进入项目根路径运行指令（在package.json能找到所有指令）： -以微信小程序为例：```npm run build:mp-weixin``` -以H5为例： ```npm run build:h5``` - + `npm install` +3. 运行项目---进入项目根路径运行指令（在 package.json 能找到所有指令）： + 以微信小程序为例：`npm run dev:mp-weixin` + 以 H5 为例 ` npm run dev:h5` +4. 查看项目 以微信小程序为例： + 打开微信开发者工具，导入项目路径 dist\dev\mp-weixin + 以 H5 为例：打开浏览器，输入控制台输出的地址 + 注：公众号属于 H5，以微信公众号为例，打开微信开发者工具，输入控制台输出的地址 +5. 打包项目---进入项目根路径运行指令（在 package.json 能找到所有指令）： + 以微信小程序为例：`npm run build:mp-weixin` + 以 H5 为例： `npm run build:h5` ### 代码压缩 默认是启动代码压缩的， -如果需要关闭代码压缩，可以将vite.config.js中的build.minify赋值为false。 +如果需要关闭代码压缩，可以将 vite.config.js 中的 build.minify 赋值为 false。 -如果需要打开代码压缩，可以将vite.config.js中的build.minify赋值为true。 +如果需要打开代码压缩，可以将 vite.config.js 中的 build.minify 赋值为 true。 # 内置组件(geek-xd) @@ -77,11 +93,11 @@ pnpm install #### tab - 页面插件 -可以通过设置参数中的config.data来实现页面传参 +可以通过设置参数中的 config.data 来实现页面传参 | 方法 | 作用 | 参数 | | ------------ | ------------------------------------------------ | ----------- | -| getData | 可以拿到上个页面通过tab传递的参数 | 无 | +| getData | 可以拿到上个页面通过 tab 传递的参数 | 无 | | reLaunch | 关闭所有页面，打开到应用内的某个页面 | url、config | | switchTab | 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面 | url、config | | redirectTo | 关闭当前页面，跳转到应用内的某个页面 | url、config | @@ -90,7 +106,7 @@ pnpm install #### auth - 鉴权插件 -下面所有方法返回值都是布尔值，permission代表权限字符串，role代表角色字符串，复数形式代表数组。 +下面所有方法返回值都是布尔值，permission 代表权限字符串，role 代表角色字符串，复数形式代表数组。 | 方法 | 作用 | 参数 | | ----------- | ------------------------------------------ | ----------- | @@ -103,7 +119,7 @@ pnpm install #### modal - 弹窗插件 -content是消息内容，option是详细配置。 +content 是消息内容，option 是详细配置。 | 方法 | 作用 | 参数 | | ------------ | ------------------------------ | ------- | @@ -119,7 +135,7 @@ content是消息内容，option是详细配置。 #### bus - 事件插件 -eventName是事件名称，eventFun是事件处理函数，请尽量避免事件插件的使用，请在组件销毁是解绑素有该组件有关的事件，避免产生bug。 +eventName 是事件名称，eventFun 是事件处理函数，请尽量避免事件插件的使用，请在组件销毁是解绑素有该组件有关的事件，避免产生 bug。 | 方法 | 作用 | 参数 | | ----- | ------------ | ------------------- | @@ -129,99 +145,106 @@ eventName是事件名称，eventFun是事件处理函数，请尽量避免事件 #### socket -设置项enableUUID，是否启用基于uuid的消息处理机制，要求当发送的消息携带uuid字段时，返回的消息也要携带uuid字段。 +设置项 enableUUID，是否启用基于 uuid 的消息处理机制，要求当发送的消息携带 uuid 字段时，返回的消息也要携带 uuid 字段。 -设置项enableEvent，是否启用基于事件的消息处理机制，要求当希望被事件处理函数处理的消息需要携带event字段。 +设置项 enableEvent，是否启用基于事件的消息处理机制，要求当希望被事件处理函数处理的消息需要携带 event 字段。 -| 方法 | 作用 | 参数 | -| --------- | ----------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- | -| connect | 连接websocke，当连接成功后触发回调函数 | 最简单的用法就是传入{url:"ws://demo"} | -| send | 发送信息，当uuid不为空且不为false时，当收到携带相同uuid的消息时触发回调函数，只触发一次。否则由默认处理函数处理。 | msg消息内容，会被处理成json字符串uuid唯一标识符，可以手动传入，也可以设置为true当为true时会自动生成一个uuid并添加到msg中。 | -| close | 关闭连接，会触发回调函数的内容，不会触发默认关闭事件的处理函数，也不会修改默认关闭事件的处理函数。 | 无 | -| on | 监听事件，当收到携带event的消息时会调用回调函数。 | event事件的名称 | -| off | 取消监听事件 | | -| onMessage | 定义默认监听事件 | callback 默认监听事件的处理函数 | -| onError | 定义异常事件 | callback 默认异常事件的处理函数 | -| onClose | 定义关闭事件 | callback 默认关闭事件的处理函数 | +| 方法 | 作用 | 参数 | +| --------- | ----------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- | +| connect | 连接 websocke，当连接成功后触发回调函数 | 最简单的用法就是传入{url:"ws://demo"} | +| send | 发送信息，当 uuid 不为空且不为 false 时，当收到携带相同 uuid 的消息时触发回调函数，只触发一次。否则由默认处理函数处理。 | msg 消息内容，会被处理成 json 字符串 uuid 唯一标识符，可以手动传入，也可以设置为 true 当为 true 时会自动生成一个 uuid 并添加到 msg 中。 | +| close | 关闭连接，会触发回调函数的内容，不会触发默认关闭事件的处理函数，也不会修改默认关闭事件的处理函数。 | 无 | +| on | 监听事件，当收到携带 event 的消息时会调用回调函数。 | event 事件的名称 | +| off | 取消监听事件 | | +| onMessage | 定义默认监听事件 | callback 默认监听事件的处理函数 | +| onError | 定义异常事件 | callback 默认异常事件的处理函数 | +| onClose | 定义关闭事件 | callback 默认关闭事件的处理函数 | # 作者建议 ### 对于选项式 ```js -this.$tab // 建议使用this.$tab进行页面跳转，理由：便于在跳转前处理其他事务 -this.$auth // 建议使用this.$auth进行鉴权操作 -this.$modal // 建议使用this.$modal打开弹窗，理由：便于以后想要使用自定义弹窗 +this.$tab; // 建议使用this.$tab进行页面跳转，理由：便于在跳转前处理其他事务 +this.$auth; // 建议使用this.$auth进行鉴权操作 +this.$modal; // 建议使用this.$modal打开弹窗，理由：便于以后想要使用自定义弹窗 ``` ### 对于组合式 ```js -import tab from '@/plugins/tab' // 建议使用tab进行页面跳转，理由：便于在跳转前处理其他事务 -import auth from '@/plugins/auth' // 建议使用auth进行鉴权操作 -import modal from '@/plugins/modal' // 建议使用modal打开弹窗，理由：便于以后想要使用自定义弹窗 +import tab from "@/plugins/tab"; // 建议使用tab进行页面跳转，理由：便于在跳转前处理其他事务 +import auth from "@/plugins/auth"; // 建议使用auth进行鉴权操作 +import modal from "@/plugins/modal"; // 建议使用modal打开弹窗，理由：便于以后想要使用自定义弹窗 // 也可以使用下面的方式 -import { tab, auth, modal} from '@/plugins' +import { tab, auth, modal } from "@/plugins"; ``` -### 对于ucharts +### 对于 ucharts 建议即便暂时不使用图表也不要删除它，以后可能会用到。 # 压缩内存 -(主包最低809kb左右) +(主包最低 809kb 左右) -### 删除geek组件 +### 删除 geek 组件 -1. 删除pages_geek和components/geek-xd文件夹 -2. 删除pages.json中subPackages的root值为“pages_geek/pages”的配置 -3. 删除pages/template.config.js中geek组件 +1. 删除 pages_geek 和 components/geek-xd 文件夹 +2. 删除 pages.json 中 subPackages 的 root 值为“pages_geek/pages”的配置 +3. 删除 pages/template.config.js 中 geek 组件 ### 去除模板 -（占用主包582kb左右） +（占用主包 582kb 左右） -1. 删除pages_template、pages_qiun两个文件夹 -2. 删除pages.json中subPackages的root值为“pages_qiun/pages”、“pages_template/pages”的两个配置 -3. 删除pages/template.config.js和pages/template.vue -4. 删除pages.json中subPackages的“tabBar”中的模板一项和“pages”中模板的一项 -5. 删除static中的uview，里面都是示例图片。 -6. 删除plugins中的config.js和common.js，并在plugins/index.js中删除相关配置 +1. 删除 pages_template、pages_qiun 两个文件夹 +2. 删除 pages.json 中 subPackages 的 root 值为“pages_qiun/pages”、“pages_template/pages”的两个配置 +3. 删除 pages/template.config.js 和 pages/template.vue +4. 删除 pages.json 中 subPackages 的“tabBar”中的模板一项和“pages”中模板的一项 +5. 删除 static 中的 uview，里面都是示例图片。 +6. 删除 plugins 中的 config.js 和 common.js，并在 plugins/index.js 中删除相关配置 -### 删除uchart +### 删除 uchart -（占用主包175kb左右，不建议删除，以防以后会用） +（占用主包 175kb 左右，不建议删除，以防以后会用） -1. 删除components/qiun-data-charts文件夹 -2. 删除pages.json中的easycom下的custom中的"qiun-(.*)"的那一行 -3. 删除pages/index中使用 “qiun-data-charts” 的部分 +1. 删除 components/qiun-data-charts 文件夹 +2. 删除 pages.json 中的 easycom 下的 custom 中的"qiun-(.\*)"的那一行 +3. 删除 pages/index 中使用 “qiun-data-charts” 的部分 -### 删除uview +### 删除 uview （按需引入，没必要删除） -1. main.js或者main.ts中删除 +1. main.js 或者 main.ts 中删除 ```js -import uviewPlus from 'uview-plus' +import uviewPlus from "uview-plus"; // ...... -app.use(uviewPlus) +app.use(uviewPlus); ``` -2. uni.scss中删除 @import 'uview-plus/theme.scss'; -3. App.vue中删除 @import '@/static/scss/index.scss'; -4. package.json中删除 "clipboard": "^2.0.11","dayjs": "^1.11.9","uview-plus": "^3.1.36", +2. uni.scss 中删除 @import 'uview-plus/theme.scss'; +3. App.vue 中删除 @import '@/static/scss/index.scss'; +4. package.json 中删除 "clipboard": "^2.0.11","dayjs": "^1.11.9","uview-plus": "^3.1.36", + +# 功能演示 + + + + + # 附录 -[Vue3官网](https://cn.vuejs.org/)； -[uniapp官网](https://uniapp.dcloud.net.cn/)； -[uView-plus官网](https://uiadmin.net/uview-plus/)； -[uCharts官网](https://www.ucharts.cn/v2/#/)； -[RuoYi官网](http://ruoyi.vip/)； +[Vue3 官网](https://cn.vuejs.org/)； +[uniapp 官网](https://uniapp.dcloud.net.cn/)； +[uView-plus 官网](https://uiadmin.net/uview-plus/)； +[uCharts 官网](https://www.ucharts.cn/v2/#/)； +[RuoYi 官网](http://ruoyi.vip/)； **联系我们：** -QQ交流群：744785891 +QQ 交流群：744785891 diff --git a/doc/image/index.png b/doc/image/index.png new file mode 100644 index 0000000..8704d10 Binary files /dev/null and b/doc/image/index.png differ diff --git a/doc/image/logo.png b/doc/image/logo.png new file mode 100644 index 0000000..dab35ca Binary files /dev/null and b/doc/image/logo.png differ diff --git a/doc/image/mallMenu.png b/doc/image/mallMenu.png new file mode 100644 index 0000000..7aeeae0 Binary files /dev/null and b/doc/image/mallMenu.png differ diff --git a/doc/image/template1.png b/doc/image/template1.png new file mode 100644 index 0000000..a442462 Binary files /dev/null and b/doc/image/template1.png differ diff --git a/doc/image/template2.png b/doc/image/template2.png new file mode 100644 index 0000000..bd522e0 Binary files /dev/null and b/doc/image/template2.png differ