uniapp-admin 项目使用与配置指南

uniapp-admin 项目使用与配置指南

uniapp-admin Muti-platform management system for uniapp, H5, Android, IOS, Min Program 项目地址: https://gitcode.com/gh_mirrors/uni/uniapp-admin

1. 项目的目录结构及介绍

uniapp-admin 是一个基于 uni-app 开发的前后端分离的多平台管理系统模板。下面是该项目的目录结构及各部分功能的简要介绍：

uniapp-admin/
├── .gitignore                # git 忽略文件
├── README.md                 # 项目说明文件
├── manifest.json             # 应用的配置文件
├── pages.json                # 页面配置文件
├── main.js                   # 应用的入口文件
├── App.vue                   # 应用的根组件
├── pages/                    # 页面目录
│   ├── index                 # 首页相关文件
│   ├── login                 # 登录页面相关文件
│   └── ...                   # 其他页面
├── static/                   # 静态资源目录
│   ├── css                   # 样式文件
│   ├── images                # 图片资源
│   └── ...                   # 其他静态资源
├── components/               # 组件目录
│   ├── header                # 头部组件
│   ├── footer                # 底部组件
│   └── ...                   # 其他组件
├── common/                   # 公共模块目录
│   ├── api                   # 接口请求相关
│   ├── config                # 配置文件
│   └── ...                   # 其他公共模块
└── utils/                    # 工具类目录
    ├── request               # 请求封装
    └── ...                   # 其他工具类

2. 项目的启动文件介绍

main.js 是应用的入口文件，主要包含以下内容：

• 引入并使用 Vue 框架。
• 引入 App 组件。
• 引入应用配置。
• 使用 uniApp 启动应用。

import Vue from 'vue'
import App from './App'

Vue.config.productionTip = false

App.mpType = 'app'

const app = new Vue({
    ...App
})
app.$mount()

3. 项目的配置文件介绍

manifest.json 是应用的配置文件，主要包含以下配置：

• 应用名称、图标、版本等信息。
• H5 环境的配置，如端口、代理等。
• 应用的页面路由配置。
• 应用的权限配置。

{
    "name": "uniapp-admin",
    "appid": "__UNI__849F1A0D",
    "version": "1.0.0",
    "versionCode": "100",
    "transformPx": false,
    "app-plus": {
        "usingComponents": {}
    },
    "h5": {
        "devServer": {
            "port": 9090,
            "disableHostCheck": true,
            "proxy": {
                "/ua/ua-service": {
                    "target": "http://localhost:8080",
                    "changeOrigin": true,
                    "secure": false,
                    "pathRewrite": {
                        "^/ua": ""
                    }
                },
                "/ua-service": {
                    "target": "http://localhost:8080",
                    "changeOrigin": true,
                    "secure": false
                }
            }
        },
        "router": {
            "mode": "hash",
            "base": "/ua"
        }
    }
}

pages.json 是页面配置文件，主要包含以下配置：

• 页面的路由和页面配置。
• 底部导航栏配置。
• 页面窗口配置。

{
    "pages": [
        {
            "path": "pages/index/index",
            "style": {
                "navigationBarTitleText": "首页"
            }
        },
        {
            "path": "pages/login/login",
            "style": {
                "navigationBarTitleText": "登录"
            }
        }
    ],
    "tabBar": {
        "color": "#999999",
        "selectedColor": "#1c1c1c",
        "backgroundColor": "#ffffff",
        "list": [
            {
                "pagePath": "pages/index/index",
                "text": "首页"
            },
            {
                "pagePath": "pages/login/login",
                "text": "我的"
            }
        ]
    },
    "globalStyle": {
        "navigationBarTextStyle": "black",
        "navigationBarTitleText": "uniapp-admin",
        "navigationBarBackgroundColor": "#F8F8F8",
        "backgroundColor": "#F8F8F8"
    }
}

以上是 uniapp-admin 项目的目录结构及启动、配置文件介绍。希望对您的使用和配置有所帮助。

uniapp-admin Muti-platform management system for uniapp, H5, Android, IOS, Min Program 项目地址: https://gitcode.com/gh_mirrors/uni/uniapp-admin