This commit is contained in:
浅念
2025-12-22 11:42:39 +08:00
parent 1b04abc3b4
commit 3c40ea3ee3
10 changed files with 30908 additions and 0 deletions
+21
View File
@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2025 SuperManTT
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+77
View File
@@ -0,0 +1,77 @@
# 菜单权限控制问题修复方案
## 问题描述
在后端控制模式下,当普通用户登录后再退出登录管理员时,管理员特有的菜单会出现404错误。
## 问题原因
1. **路由注册状态未正确重置**:`isRouteRegistered` 标志位在用户切换时没有正确重置
2. **动态路由清理不完整**:`resetRouterState` 函数只清理了带有 `meta.dynamic` 标记的路由
3. **工作台标签页验证时机问题**:`validateWorktabs` 在路由重新注册后执行,但可能没有正确清理无效的标签页
4. **用户信息变化检测缺失**:没有检测用户切换事件,导致路由状态没有及时更新
## 修复方案
### 1. 改进路由状态重置 (`src/router/guards/beforeEach.ts`)
- 修改 `resetRouterState` 函数,清理所有动态注册的路由(不仅仅是带有dynamic标记的)
- 添加工作台标签页的清理
- 使用菜单store的 `clearMenuList` 方法
### 2. 添加用户切换检测 (`src/router/guards/beforeEach.ts`)
- 在 `handleRouteGuard` 函数中添加用户信息变化检测
- 使用 `sessionStorage` 缓存用户信息,检测用户切换
- 当检测到用户信息变化时,强制重置路由状态
### 3. 改进菜单API (`src/api/menuApi.ts`)
- 添加用户登录状态验证
- 改进菜单数据验证逻辑
- 添加更详细的错误处理和日志
### 4. 完善用户登出逻辑 (`src/store/modules/user.ts`)
- 在 `logOut` 方法中添加更完整的状态清理
- 清理用户信息缓存
- 确保工作台标签页被正确清理
### 5. 增强菜单Store (`src/store/modules/menu.ts`)
- 添加 `clearMenuList` 方法用于清理菜单数据
- 提供更完整的状态管理
### 6. 改进错误处理 (`src/router/guards/beforeEach.ts`)
- 修改 `handleMenuError` 函数,确保在菜单处理失败时正确清理所有状态
- 添加更详细的状态清理逻辑
## 测试工具
创建了 `src/utils/menuPermissionTest.ts` 测试工具,包含:
- `testMenuPermissionSwitch()`: 测试菜单权限切换的正确性
- `simulateUserSwitch()`: 模拟用户切换过程
## 使用方法
1. 在浏览器控制台中调用 `testMenuPermissionSwitch()` 检查当前状态
2. 在用户切换后调用 `simulateUserSwitch()` 模拟切换过程
3. 观察控制台输出,确认路由和菜单状态正确
## 预期效果
修复后,当用户切换时:
1. 所有动态路由会被正确清理
2. 菜单数据会被重新加载
3. 工作台标签页会被验证和清理
4. 不会出现404错误
5. 用户权限会正确应用
## 注意事项
- 确保后端返回的菜单数据与用户权限匹配
- 在开发环境中可以使用测试工具验证修复效果
- 建议在生产环境中添加更多的日志记录用于问题排查
+79
View File
@@ -0,0 +1,79 @@
English | [简体中文](./README.zh-CN.md)
## About Art Design Pro
As a developer, I needed to build admin management systems for multiple projects but found that traditional systems couldn't fully meet the requirements for user experience and visual design. Therefore, I created Art Design Pro, an open-source admin management solution focused on user experience and rapid development. Based on the ElementPlus design specifications, it has been visually optimized to provide a more beautiful and practical front-end interface, helping you easily build high-quality admin systems.
## Demo Images
### Light Theme
![Light Theme](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover1.png)
![Light Theme](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover2.png)
### Dark Theme
![Dark Theme](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover3.png)
![Dark Theme](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover4.png)
## Features
- Uses the latest technology stack
- Built-in common business component templates
- Provides multiple theme modes and customizable themes
- Beautiful UI design, excellent user experience, and attention to detail
- System fully supports customization, meeting your personalized needs
## Functionality
- Rich theme switching
- Global search
- Lock screen
- Multi-tabs
- Global breadcrumbs
- Multi-language support
- Icon library
- Rich text editor
- Echarts charts
- Utils toolkit
- Network exception handling
- Route-level authentication
- Sidebar menu authentication
- Authentication directives
- Mobile adaptation
- Excellent persistent storage solution
- Local data storage validation
- Code commit validation and formatting
- Code commit standardization
## Compatibility
- Supports modern mainstream browsers such as Chrome, Safari, Firefox, etc.
## Installation and Running
```bash
# Install dependencies
pnpm install
# If pnpm install fails, try using the following command to install dependencies
pnpm install --ignore-scripts
# Start local development environment
pnpm dev
# Build for production
pnpm build
```
## Technical Support
QQ Group: <a href="https://qm.qq.com/cgi-bin/qm/qr?k=Gg6yzZLFaNgmRhK0T5Qcjf7-XcAFWWXm&jump_from=webapi&authKey=YpRKVJQyFKYbGTiKw0GJ/YQXnNF+GdXNZC5beQQqnGZTvuLlXoMO7nw5fNXvmVhA">821834289</a> (Click the link to join the group chat)
## Donation
If my project has been helpful to you, donations are welcome! Your support will be used to purchase tools like ChatGPT, Cursor, etc., to improve development efficiency and make the project even better. Thank you for your encouragement and support!
![Donation QR Code](https://www.qiniu.lingchen.kim/%E7%BB%84%202%402x%202.png)
+84
View File
@@ -0,0 +1,84 @@
简体中文 | [English](./README.md)
## 关于 Art Design Pro
作为一名开发者,我在多个项目中需要搭建后台管理系统,但发现传统系统在用户体验和视觉设计上不能完全满足需求。因此,我创建了 Art Design Pro,一款专注于用户体验和快速开发的开源后台管理解决方案。基于 ElementPlus 设计规范,进行了视觉上的精心优化,提供更美观、更实用的前端界面,帮助你轻松构建高质量的后台系统。
## 演示图
### 浅色主题
![浅色主题](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover1.png)
![浅色主题](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover2.png)
### 暗黑主题
![暗黑主题](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover3.png)
![暗黑主题](https://www.qiniu.lingchen.kim/art_design_pro_readme_cover4.png)
## 特点
- 使用最新技术栈
- 内置常用业务组件模版
- 提供多种主题模式,可以自定义主题
- 漂亮的 UI设计、极致的用户体验和细节处理
- 系统全面支持自定义设置,满足您的个性化需求
## 技术栈
- 开发框架:Vue3、TypeScript、Vite、Element-Plus
- 代码规范:Eslint、Prettier、Stylelint、Husky、Lint-staged、cz-git
## 功能
- 丰富主题切换
- 全局搜索
- 锁屏
- 多标签页
- 全局面包屑
- 多语言
- 图标库
- 富文本编辑器
- Echarts 图表
- Utils工具包
- 网络异常处理
- 路由级别鉴权
- 侧边栏菜单鉴权
- 鉴权指令
- 移动端适配
- 优秀的持久化存储方案
- 本地数据存储校验
- 代码提交校验与格式化
- 代码提交规范化
## 兼容性
- 支持 Chrome、Safari、Firefox 等现代主流浏览器。
## 安装运行
```bash
# 安装依赖
pnpm install
# 如果 pnpm install 安装失败,尝试使用下面的命令安装依赖
pnpm install --ignore-scripts
# 本地开发环境启动
pnpm dev
# 生产环境打包
pnpm build
```
## 技术支持
QQ群:<a href="https://qm.qq.com/cgi-bin/qm/qr?k=Gg6yzZLFaNgmRhK0T5Qcjf7-XcAFWWXm&jump_from=webapi&authKey=YpRKVJQyFKYbGTiKw0GJ/YQXnNF+GdXNZC5beQQqnGZTvuLlXoMO7nw5fNXvmVhA">821834289</a>(点击链接加入群聊)
## 捐赠
如果我的项目对你有所帮助,欢迎捐赠支持!你的支持将用于购买 ChatGPT、Cursor 等工具,以提升开发效率,让项目变得更好。感谢你的鼓励与支持!
![捐赠二维码](https://www.qiniu.lingchen.kim/%E7%BB%84%202%402x%202.png)
+205
View File
@@ -0,0 +1,205 @@
{
root: '/Users/tt/Downloads/art-design-pro',
registry: 'https://registry.npmmirror.com',
pkgs: [
{
name: '',
version: '/Users/tt/Downloads/art-design-pro/@types/vite/client',
type: 'directory',
alias: undefined,
arg: [Result]
}
],
production: false,
cacheStrict: false,
cacheDir: '/Users/tt/.npminstall_tarball',
env: {
npm_config_registry: 'https://registry.npmmirror.com',
npm_config_argv: '{"remain":[],"cooked":["--fix-bug-versions","--china","--userconfig=/Users/tt/.cnpmrc","--disturl=https://cdn.npmmirror.com/binaries/node","--registry=https://registry.npmmirror.com","--save-dev","@types/vite/client"],"original":["--fix-bug-versions","--china","--userconfig=/Users/tt/.cnpmrc","--disturl=https://cdn.npmmirror.com/binaries/node","--registry=https://registry.npmmirror.com","--save-dev","@types/vite/client"]}',
npm_config_user_agent: 'npminstall/7.12.0 npm/? node/v18.20.4 darwin x64',
npm_config_cache: '/Users/tt/.npminstall_tarball',
NODE: '/Users/tt/.nvm/versions/node/v18.20.4/bin/node',
npm_node_execpath: '/Users/tt/.nvm/versions/node/v18.20.4/bin/node',
npm_execpath: '/usr/local/lib/node_modules/cnpm/node_modules/npminstall/bin/install.js',
npm_config_userconfig: '/Users/tt/.cnpmrc',
npm_config_disturl: 'https://cdn.npmmirror.com/binaries/node',
npm_config_r: 'https://registry.npmmirror.com',
COREPACK_NPM_REGISTRY: 'https://registry.npmmirror.com',
EDGEDRIVER_CDNURL: 'https://npmmirror.com/mirrors/edgedriver',
NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
NVM_NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
PHANTOMJS_CDNURL: 'https://cdn.npmmirror.com/binaries/phantomjs',
CHROMEDRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/chromedriver',
OPERADRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/operadriver',
CYPRESS_DOWNLOAD_PATH_TEMPLATE: 'https://cdn.npmmirror.com/binaries/cypress/${version}/${platform}-${arch}/cypress.zip',
ELECTRON_MIRROR: 'https://cdn.npmmirror.com/binaries/electron/',
ELECTRON_BUILDER_BINARIES_MIRROR: 'https://cdn.npmmirror.com/binaries/electron-builder-binaries/',
SASS_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-sass',
SWC_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-swc',
NWJS_URLBASE: 'https://cdn.npmmirror.com/binaries/nwjs/v',
PUPPETEER_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
PUPPETEER_DOWNLOAD_BASE_URL: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
PLAYWRIGHT_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/playwright',
SENTRYCLI_CDNURL: 'https://cdn.npmmirror.com/binaries/sentry-cli',
SAUCECTL_INSTALL_BINARY_MIRROR: 'https://cdn.npmmirror.com/binaries/saucectl',
RE2_DOWNLOAD_MIRROR: 'https://cdn.npmmirror.com/binaries/node-re2',
RE2_DOWNLOAD_SKIP_PATH: 'true',
PRISMA_ENGINES_MIRROR: 'https://cdn.npmmirror.com/binaries/prisma',
npm_config_better_sqlite3_binary_host: 'https://cdn.npmmirror.com/binaries/better-sqlite3',
npm_config_keytar_binary_host: 'https://cdn.npmmirror.com/binaries/keytar',
npm_config_sharp_binary_host: 'https://cdn.npmmirror.com/binaries/sharp',
npm_config_sharp_libvips_binary_host: 'https://cdn.npmmirror.com/binaries/sharp-libvips',
npm_config_robotjs_binary_host: 'https://cdn.npmmirror.com/binaries/robotjs',
npm_rootpath: '/Users/tt/Downloads/art-design-pro',
INIT_CWD: '/Users/tt/Downloads/art-design-pro'
},
binaryMirrors: {
ENVS: {
COREPACK_NPM_REGISTRY: 'https://registry.npmmirror.com',
EDGEDRIVER_CDNURL: 'https://npmmirror.com/mirrors/edgedriver',
NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
NVM_NODEJS_ORG_MIRROR: 'https://cdn.npmmirror.com/binaries/node',
PHANTOMJS_CDNURL: 'https://cdn.npmmirror.com/binaries/phantomjs',
CHROMEDRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/chromedriver',
OPERADRIVER_CDNURL: 'https://cdn.npmmirror.com/binaries/operadriver',
CYPRESS_DOWNLOAD_PATH_TEMPLATE: 'https://cdn.npmmirror.com/binaries/cypress/${version}/${platform}-${arch}/cypress.zip',
ELECTRON_MIRROR: 'https://cdn.npmmirror.com/binaries/electron/',
ELECTRON_BUILDER_BINARIES_MIRROR: 'https://cdn.npmmirror.com/binaries/electron-builder-binaries/',
SASS_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-sass',
SWC_BINARY_SITE: 'https://cdn.npmmirror.com/binaries/node-swc',
NWJS_URLBASE: 'https://cdn.npmmirror.com/binaries/nwjs/v',
PUPPETEER_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
PUPPETEER_DOWNLOAD_BASE_URL: 'https://cdn.npmmirror.com/binaries/chrome-for-testing',
PLAYWRIGHT_DOWNLOAD_HOST: 'https://cdn.npmmirror.com/binaries/playwright',
SENTRYCLI_CDNURL: 'https://cdn.npmmirror.com/binaries/sentry-cli',
SAUCECTL_INSTALL_BINARY_MIRROR: 'https://cdn.npmmirror.com/binaries/saucectl',
RE2_DOWNLOAD_MIRROR: 'https://cdn.npmmirror.com/binaries/node-re2',
RE2_DOWNLOAD_SKIP_PATH: 'true',
PRISMA_ENGINES_MIRROR: 'https://cdn.npmmirror.com/binaries/prisma',
npm_config_better_sqlite3_binary_host: 'https://cdn.npmmirror.com/binaries/better-sqlite3',
npm_config_keytar_binary_host: 'https://cdn.npmmirror.com/binaries/keytar',
npm_config_sharp_binary_host: 'https://cdn.npmmirror.com/binaries/sharp',
npm_config_sharp_libvips_binary_host: 'https://cdn.npmmirror.com/binaries/sharp-libvips',
npm_config_robotjs_binary_host: 'https://cdn.npmmirror.com/binaries/robotjs'
},
'@ali/s2': { host: 'https://cdn.npmmirror.com/binaries/looksgood-s2' },
sharp: { replaceHostFiles: [Array], replaceHostMap: [Object] },
'@tensorflow/tfjs-node': {
replaceHostFiles: [Array],
replaceHostRegExpMap: [Object],
replaceHostMap: [Object]
},
cypress: {
host: 'https://cdn.npmmirror.com/binaries/cypress',
newPlatforms: [Object]
},
'utf-8-validate': {
host: 'https://cdn.npmmirror.com/binaries/utf-8-validate/v{version}'
},
xprofiler: {
remote_path: './xprofiler/v{version}/',
host: 'https://cdn.npmmirror.com/binaries'
},
leveldown: { host: 'https://cdn.npmmirror.com/binaries/leveldown/v{version}' },
couchbase: { host: 'https://cdn.npmmirror.com/binaries/couchbase/v{version}' },
gl: { host: 'https://cdn.npmmirror.com/binaries/gl/v{version}' },
sqlite3: {
host: 'https://cdn.npmmirror.com/binaries/sqlite3',
remote_path: 'v{version}'
},
'@journeyapps/sqlcipher': { host: 'https://cdn.npmmirror.com/binaries' },
grpc: {
host: 'https://cdn.npmmirror.com/binaries',
remote_path: '{name}/v{version}'
},
'grpc-tools': { host: 'https://cdn.npmmirror.com/binaries' },
wrtc: {
host: 'https://cdn.npmmirror.com/binaries',
remote_path: '{name}/v{version}'
},
fsevents: { host: 'https://cdn.npmmirror.com/binaries/fsevents' },
nodejieba: { host: 'https://cdn.npmmirror.com/binaries/nodejieba' },
canvas: { host: 'https://cdn.npmmirror.com/binaries/canvas' },
'skia-canvas': { host: 'https://cdn.npmmirror.com/binaries/skia-canvas' },
'flow-bin': {
replaceHost: 'https://github.com/facebook/flow/releases/download/v',
host: 'https://cdn.npmmirror.com/binaries/flow/v'
},
'jpegtran-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/jpegtran-bin'
},
'cwebp-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/cwebp-bin'
},
'zopflipng-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/zopflipng-bin'
},
'optipng-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/optipng-bin'
},
mozjpeg: {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/mozjpeg-bin'
},
gifsicle: {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/gifsicle-bin'
},
'pngquant-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/pngquant-bin',
replaceHostMap: [Object]
},
'pngcrush-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/pngcrush-bin'
},
'jpeg-recompress-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/jpeg-recompress-bin'
},
'advpng-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/advpng-bin'
},
'pngout-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/pngout-bin'
},
'jpegoptim-bin': {
replaceHost: [Array],
host: 'https://cdn.npmmirror.com/binaries/jpegoptim-bin'
},
argon2: { host: 'https://cdn.npmmirror.com/binaries/argon2' },
'ali-zeromq': { host: 'https://cdn.npmmirror.com/binaries/ali-zeromq' },
'ali-usb_ctl': { host: 'https://cdn.npmmirror.com/binaries/ali-usb_ctl' },
'gdal-async': { host: 'https://cdn.npmmirror.com/binaries/node-gdal-async' },
'libpg-query': { host: 'https://cdn.npmmirror.com/binaries' }
},
forbiddenLicenses: null,
flatten: false,
proxy: undefined,
prune: false,
disableFallbackStore: false,
workspacesMap: Map(0) {},
enableWorkspace: false,
workspaceRoot: '/Users/tt/Downloads/art-design-pro',
isWorkspaceRoot: true,
isWorkspacePackage: false,
offline: false,
strictSSL: true,
ignoreScripts: false,
foregroundScripts: false,
ignoreOptionalDependencies: false,
detail: false,
forceLinkLatest: false,
trace: false,
engineStrict: false,
registryOnly: false,
client: false,
autoFixVersion: [Function: autoFixVersion]
}
+16227
View File
File diff suppressed because it is too large Load Diff
+121
View File
@@ -0,0 +1,121 @@
{
"name": "art-design-pro",
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite --open",
"build": "vue-tsc --noEmit && vite build",
"serve": "vite preview",
"lint": "eslint",
"fix": "eslint --fix",
"lint:prettier": "prettier --write \"**/*.{js,cjs,ts,json,tsx,css,less,scss,vue,html,md}\"",
"lint:stylelint": "stylelint \"**/*.{css,scss,vue}\" --fix",
"lint:lint-staged": "lint-staged",
"prepare": "husky",
"commit": "git-cz"
},
"config": {
"commitizen": {
"path": "node_modules/cz-git"
}
},
"lint-staged": {
"*.{js,ts,vue}": [
"eslint --fix --quiet",
"prettier --write"
],
"*.{js,ts,mjs,mts,tsx}": [
"eslint --fix",
"prettier --write"
],
"*.{cjs,json,jsonc}": [
"prettier --write"
],
"*.vue": [
"eslint --fix",
"stylelint --fix --allow-empty-input",
"prettier --write"
],
"*.{html,htm}": [
"prettier --write"
],
"*.{scss,css,less}": [
"stylelint --fix --allow-empty-input",
"prettier --write"
],
"*.{md,mdx}": [
"prettier --write"
],
"*.{yaml,yml}": [
"prettier --write"
]
},
"dependencies": {
"@element-plus/icons-vue": "^2.3.1",
"@types/echarts": "^4.9.22",
"@vue/reactivity": "^3.4.35",
"@vueuse/core": "^11.0.0",
"@wangeditor/editor": "^5.1.23",
"@wangeditor/editor-for-vue": "next",
"axios": "^1.7.5",
"crypto-js": "^4.2.0",
"echarts": "^5.4.0",
"echarts-gl": "^2.0.9",
"element-plus": "^2.8.0",
"file-saver": "^2.0.5",
"highlight.js": "^11.10.0",
"md-editor-v3": "^4.17.0",
"mitt": "^3.0.1",
"nprogress": "^0.2.0",
"pinia": "^3.0.2",
"pinia-plugin-persistedstate": "^4.3.0",
"qrcode.vue": "^3.6.0",
"vue": "^3.5.12",
"vue-draggable-plus": "^0.6.0",
"vue-i18n": "^9.14.0",
"vue-router": "^4.4.2",
"vue3-count-to": "^1.1.2",
"xgplayer": "^3.0.20",
"xlsx": "^0.18.5"
},
"devDependencies": {
"@commitlint/cli": "^19.4.1",
"@commitlint/config-conventional": "^19.4.1",
"@eslint/js": "^9.9.1",
"@types/node": "^22.1.0",
"@typescript-eslint/eslint-plugin": "^8.3.0",
"@typescript-eslint/parser": "^8.3.0",
"@vitejs/plugin-vue": "^5.2.1",
"@vue/compiler-sfc": "^3.0.5",
"commitizen": "^4.3.0",
"cz-git": "^1.11.1",
"eslint": "^9.9.1",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.2.1",
"eslint-plugin-vue": "^9.27.0",
"globals": "^15.9.0",
"husky": "^9.1.5",
"lint-staged": "^15.5.2",
"prettier": "^3.5.3",
"rollup-plugin-visualizer": "^5.12.0",
"sass": "^1.81.0",
"stylelint": "^16.20.0",
"stylelint-config-html": "^1.1.0",
"stylelint-config-recess-order": "^4.6.0",
"stylelint-config-recommended-scss": "^14.1.0",
"stylelint-config-recommended-vue": "^1.5.0",
"stylelint-config-standard": "^36.0.1",
"terser": "^5.36.0",
"typescript": "~5.6.3",
"typescript-eslint": "^8.9.0",
"unplugin-auto-import": "^0.18.3",
"unplugin-vue-components": "^0.27.4",
"vite": "^6.1.0",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-imagemin": "^0.6.1",
"vite-plugin-vue-devtools": "^7.7.6",
"vue-demi": "^0.14.9",
"vue-img-cutter": "^3.0.5",
"vue-tsc": "~2.1.6"
}
}
+13801
View File
File diff suppressed because it is too large Load Diff
+21
View File
@@ -0,0 +1,21 @@
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"moduleResolution": "node",
"strict": true,
"jsx": "preserve",
"sourceMap": true,
"resolveJsonModule": true,
"esModuleInterop": true,
"lib": ["esnext", "dom"],
"types": ["vite/client", "node", "element-plus/global"],
"skipLibCheck": true, // 针对element-plus的打包校验
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
}
},
"include": ["src/**/*", "src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
"exclude": ["node_modules", "dist", "**/*.js"]
}
+272
View File
@@ -0,0 +1,272 @@
import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
import viteCompression from 'vite-plugin-compression'
import Components from 'unplugin-vue-components/vite'
import AutoImport from 'unplugin-auto-import/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import { fileURLToPath } from 'url'
// import viteImagemin from 'vite-plugin-imagemin'
// import { visualizer } from 'rollup-plugin-visualizer'
// https://devtools.vuejs.org/getting-started/introduction
import vueDevTools from 'vite-plugin-vue-devtools'
export default ({ mode }) => {
const root = process.cwd()
const env = loadEnv(mode, root)
const { VITE_VERSION, VITE_PORT, VITE_BASE_URL, VITE_API_URL } = env
console.log(`🚀 API_URL = ${VITE_API_URL}`)
console.log(`🚀 VERSION = ${VITE_VERSION}`)
return defineConfig({
define: {
__APP_VERSION__: JSON.stringify(VITE_VERSION)
},
base: VITE_BASE_URL,
server: {
port: parseInt(VITE_PORT),
proxy: {
'/api': {
target: VITE_API_URL,
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
}
},
host: true,
allowedHosts: [
'web.dp.muzili.top'
]
},
// 路径别名
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
'@views': resolvePath('src/views'),
'@imgs': resolvePath('src/assets/img'),
'@icons': resolvePath('src/assets/icons'),
'@utils': resolvePath('src/utils'),
'@stores': resolvePath('src/store'),
'@plugins': resolvePath('src/plugins'),
'@styles': resolvePath('src/assets/styles')
}
},
build: {
target: 'es2015',
outDir: 'dist',
chunkSizeWarningLimit: 2000,
minify: 'terser',
terserOptions: {
compress: {
drop_console: true, // 生产环境去除 console
drop_debugger: true // 生产环境去除 debugger
}
},
rollupOptions: {
output: {
manualChunks: {
vendor: ['vue', 'vue-router', 'pinia', 'element-plus']
}
}
},
dynamicImportVarsOptions: {
warnOnError: true,
exclude: [],
include: ['src/views/**/*.vue']
}
},
plugins: [
vue(),
// 自动导入 components 下面的组件,无需 import 引入
Components({
deep: true,
extensions: ['vue'],
dirs: ['src/components'], // 自动导入的组件目录
resolvers: [ElementPlusResolver()],
dts: 'src/types/components.d.ts' // 指定类型声明文件的路径
}),
AutoImport({
imports: ['vue', 'vue-router', '@vueuse/core', 'pinia'],
resolvers: [ElementPlusResolver()],
dts: 'src/types/auto-imports.d.ts',
eslintrc: {
// 这里先设置成true然后pnpm dev 运行之后会生成 .auto-import.json 文件之后,在改为false
enabled: true,
filepath: './.auto-import.json',
globalsPropValue: true
}
}),
// 打包分析
// visualizer({
// open: true,
// gzipSize: true,
// brotliSize: true,
// filename: 'dist/stats.html' // 分析图生成的文件名及路径
// }),
// 压缩
viteCompression({
verbose: true, // 是否在控制台输出压缩结果
disable: false, // 是否禁用
algorithm: 'gzip', // 压缩算法,可选 [ 'gzip' , 'brotliCompress' ,'deflate' , 'deflateRaw']
ext: '.gz', // 压缩后的文件名后缀
threshold: 10240, // 只有大小大于该值的资源会被处理 10240B = 10KB
deleteOriginFile: false // 压缩后是否删除原文件
}),
// 图片压缩
// viteImagemin({
// verbose: true, // 是否在控制台输出压缩结果
// // 图片压缩配置
// // GIF 图片压缩配置
// gifsicle: {
// optimizationLevel: 4, // 优化级别 1-7,7为最高级别压缩
// interlaced: false // 是否隔行扫描
// },
// // PNG 图片压缩配置
// optipng: {
// optimizationLevel: 4 // 优化级别 0-7,7为最高级别压缩
// },
// // JPEG 图片压缩配置
// mozjpeg: {
// quality: 60 // 压缩质量 0-100,值越小压缩率越高
// },
// // PNG 图片压缩配置(另一个压缩器)
// pngquant: {
// quality: [0.8, 0.9], // 压缩质量范围 0-1
// speed: 4 // 压缩速度 1-11,值越大压缩速度越快,但质量可能会下降
// },
// // SVG 图片压缩配置
// svgo: {
// plugins: [
// {
// name: 'removeViewBox' // 移除 viewBox 属性
// },
// {
// name: 'removeEmptyAttrs', // 移除空属性
// active: false // 是否启用此插件
// }
// ]
// }
// })
vueDevTools()
],
// 预加载项目必需的组件
optimizeDeps: {
include: [
'vue',
'vue-router',
'pinia',
'axios',
'@vueuse/core',
'echarts',
'@wangeditor/editor',
'@wangeditor/editor-for-vue',
'vue-i18n',
'element-plus/es/components/form/style/css',
'element-plus/es/components/form-item/style/css',
'element-plus/es/components/button/style/css',
'element-plus/es/components/input/style/css',
'element-plus/es/components/input-number/style/css',
'element-plus/es/components/switch/style/css',
'element-plus/es/components/upload/style/css',
'element-plus/es/components/menu/style/css',
'element-plus/es/components/col/style/css',
'element-plus/es/components/icon/style/css',
'element-plus/es/components/row/style/css',
'element-plus/es/components/tag/style/css',
'element-plus/es/components/dialog/style/css',
'element-plus/es/components/loading/style/css',
'element-plus/es/components/radio/style/css',
'element-plus/es/components/radio-group/style/css',
'element-plus/es/components/popover/style/css',
'element-plus/es/components/scrollbar/style/css',
'element-plus/es/components/tooltip/style/css',
'element-plus/es/components/dropdown/style/css',
'element-plus/es/components/dropdown-menu/style/css',
'element-plus/es/components/dropdown-item/style/css',
'element-plus/es/components/sub-menu/style/css',
'element-plus/es/components/menu-item/style/css',
'element-plus/es/components/divider/style/css',
'element-plus/es/components/card/style/css',
'element-plus/es/components/link/style/css',
'element-plus/es/components/breadcrumb/style/css',
'element-plus/es/components/breadcrumb-item/style/css',
'element-plus/es/components/table/style/css',
'element-plus/es/components/tree-select/style/css',
'element-plus/es/components/table-column/style/css',
'element-plus/es/components/select/style/css',
'element-plus/es/components/option/style/css',
'element-plus/es/components/pagination/style/css',
'element-plus/es/components/tree/style/css',
'element-plus/es/components/alert/style/css',
'element-plus/es/components/radio-button/style/css',
'element-plus/es/components/checkbox-group/style/css',
'element-plus/es/components/checkbox/style/css',
'element-plus/es/components/tabs/style/css',
'element-plus/es/components/tab-pane/style/css',
'element-plus/es/components/rate/style/css',
'element-plus/es/components/date-picker/style/css',
'element-plus/es/components/notification/style/css',
'element-plus/es/components/image/style/css',
'element-plus/es/components/statistic/style/css',
'element-plus/es/components/watermark/style/css',
'element-plus/es/components/config-provider/style/css',
'element-plus/es/components/text/style/css',
'element-plus/es/components/drawer/style/css',
'element-plus/es/components/color-picker/style/css',
'element-plus/es/components/backtop/style/css',
'element-plus/es/components/message-box/style/css',
'element-plus/es/components/skeleton/style/css',
'element-plus/es/components/skeleton/style/css',
'element-plus/es/components/skeleton-item/style/css',
'element-plus/es/components/badge/style/css',
'element-plus/es/components/steps/style/css',
'element-plus/es/components/step/style/css',
'element-plus/es/components/avatar/style/css',
'element-plus/es/components/descriptions/style/css',
'element-plus/es/components/descriptions-item/style/css',
'element-plus/es/components/checkbox-group/style/css',
'element-plus/es/components/progress/style/css',
'element-plus/es/components/image-viewer/style/css',
'element-plus/es/components/empty/style/css',
'element-plus/es/components/segmented/style/css',
'element-plus/es/components/calendar/style/css',
'element-plus/es/components/message/style/css',
'xlsx',
'file-saver',
'element-plus/es/components/timeline/style/css',
'element-plus/es/components/timeline-item/style/css',
'vue-img-cutter'
]
},
css: {
preprocessorOptions: {
// sass variable and mixin
scss: {
api: 'modern-compiler',
additionalData: `
@use "@styles/variables.scss" as *; @use "@styles/mixin.scss" as *;
`
}
},
postcss: {
plugins: [
{
postcssPlugin: 'internal:charset-removal',
AtRule: {
charset: (atRule) => {
if (atRule.name === 'charset') {
atRule.remove()
}
}
}
}
]
}
}
})
}
function resolvePath(paths) {
return path.resolve(__dirname, paths)
}