Descarga de wocwin admin - Descarga de código fuente wocwin admin

wocwin admin

Otras categorias

1.0.0

Descargar

proyecto wocwin-admin

Es un conjunto de plantillas de administración de backend basadas en código abierto Vue3.2, TypeScript, Vite4, Pinia y Element-Plus.
Este proyecto integra el micro frontend qiankun (es decir, se puede utilizar como una subaplicación)

Vista previa en línea

Enlace: https://wocwin.github.io/wocwin-admin/

Cuenta: wocwin; contraseña de usuario: 123456

repositorio de código

GitHub: https://github.com/wocwin/wocwin-admin
Casa rural: https://gitee.com/wocwin/wocwin-admin

Función del proyecto

Desarrollado con Vue3.2 + TypeScript, setup语法糖de componentes de un solo archivo
Utilice Vite como herramienta de empaquetado y desarrollo de proyectos (configurado con empaquetado Gzip, sintaxis TSX y proxy entre dominios)
Todo el proyecto integra TypeScript e internacionalización i18n.
Utilice Pinia para reemplazar Vuex, liviano, simple y fácil de usar (complemento de persistencia integrado)
Utilice TypeScript para encapsular todo el paquete secundario de Axios (interceptación global de errores)
Se utiliza el componente de encapsulación secundaria t-ui-plus basado en Element-plus, que contiene tablas de uso común, consultas condicionales, formularios, componentes de selección desplegable, etc.
Utilice vue-router para interceptar permisos de ruta y rutas de carga diferida
Utilice KeepAlive para almacenar en caché páginas y admitir el almacenamiento en caché de páginas anidadas de varios niveles
Utilice Prettier para formatear el código de manera uniforme e integrar las especificaciones de verificación del código de Eslint
El proyecto admite una variedad de modos de diseño convencionales; también admite cambio de tema, modo oscuro y modo gris.
El proyecto admite permisos de botones de menú (wocwin: puede ver todo, usuario: no puede ver la pantalla grande, el menú Amap y algunos botones de operación de administración del sistema).

Representaciones dinámicas

Enlace: https://blog.csdn.net/cwin8951/article/details/130269505

Instalar y usar

Nota: El entorno local requiere Node.js 16.x+ y pnpm 7.x+ instalados.

 # Gitee
git clone https://gitee.com/wocwin/wocwin-admin.git
# GitHub
git clone https://github.com/wocwin/wocwin-admin.git

# 安装pnpm

npm install pnpm -g


# 安装依赖
pnpm install --registry=https://registry.npmjs.org/
> pnpm config get registry 查看当前指向源

# 如果安装依赖失败，可以尝试使用淘宝镜像
> pnpm config set registry https://registry.npmmirror.com/ 切换淘宝镜像源
> pnpm install

# 启动服务
pnpm serve

# build
pnpm dev

# prettier 格式化代码
pnpm lint:prettier

Directorio de estructura del proyecto

 Wocwin-Admin
├─ build                  # Vite 配置项
├─ public                 # 静态资源文件（该文件夹不会被打包）
├─ src
│  ├─ api                 # API 接口管理
│  ├─ assets              # 静态资源文件
│  ├─ components          # 全局组件
│  ├─ config              # 全局配置项
│  ├─ hooks               # 常用 Hooks 封装
│  ├─ languages           # 语言国际化 i18n
│  ├─ layout              # 框架布局模块
│  ├─ router              # 路由管理
│  ├─ store               # pinia store
│  ├─ styles              # 全局样式文件
│  ├─ typings             # 全局 ts 声明
│  ├─ utils               # 常用工具库
│  ├─ views               # 项目所有页面
│  ├─ App.vue             # 项目主组件
│  ├─ main.ts             # 项目入口文件
│  ├─ auto-import.d.ts    # 自动导入vue、vue-router、pinia相关API（无需import引入）
│  └─ vite-env.d.ts       # 指定 ts 识别 vue
├─ .env.dev               # 开发环境配置
├─ .env.prod              # 生产环境配置
├─ .env.sit               # 测试环境配置
├─ .eslintignore          # 忽略 Eslint 校验
├─ .eslintrc.cjs          # Eslint 校验配置文件
├─ .gitignore             # 忽略 git 提交
├─ .prettierignore        # 忽略 Prettier 格式化
├─ .prettierrc.cjs        # Prettier 格式化配置
├─ .stylelintignore       # 忽略 stylelint 格式化
├─ .stylelintrc.cjs       # stylelint 样式格式化配置
├─ index.html             # 入口 html
├─ stats.html             # Rollup Visualizer html
├─ deploy.sh              # 发布GitHub Pages指令
├─ LICENSE                # 开源协议文件
├─ pnpm-lock.yaml         # 依赖包包版本锁
├─ package.json           # 依赖包管理
├─ postcss.config.cjs     # postcss 配置
├─ README.md              # README 介绍
├─ tsconfig.json          # typescript 全局配置
└─ vite.config.ts         # vite 全局配置文件

Interfaz de fondo del proyecto

La interfaz de backend del proyecto utiliza completamente datos Mock, gracias al siguiente soporte de plataforma Mock:

FastMock: https://www.fastmock.site (servicio descontinuado)
Fácil Mock: https://mock.mengxuegu.com

Especificaciones de confirmación de Git

ci : cambios en los archivos de configuración y scripts de ci;
chore : cambios en el sistema de construcción o herramientas auxiliares;
fix : reparación de errores de código;
feat : nueva función;
perf : optimización y mejora del rendimiento;
refactor : solo cambios de código, sin corregir errores ni introducir nuevas funciones;
style : Ajuste del formato del código, que puede ser espacios, punto y coma, sangría, etc.;
docs : cambios en los documentos;
test : complementa los casos de prueba que faltan o corrige los casos de prueba existentes;
revert : operación de reversión;