chore: 配置项目开发环境并重构接口路由前缀
1. 添加 .node-version 和 .npmrc 配置文件,使用 Volta 锁定 Node.js 18.16.0 版本,强制使用 pnpm 作为包管理器 2. 更新 package.json,添加 packageManager 和 engines 字段限制依赖安装版本,替换 npm 脚本为 pnpm 3. 重构设备管理模块的接口 BASE 路径和路由路径,统一命名为 device_model/device_category 4. 完善 README.md,新增环境要求、安装启动流程、常用命令和目录结构说明
This commit is contained in:
1
.node-version
Normal file
1
.node-version
Normal file
@@ -0,0 +1 @@
|
||||
18.16.0
|
||||
8
.npmrc
Normal file
8
.npmrc
Normal file
@@ -0,0 +1,8 @@
|
||||
# pnpm 配置
|
||||
# 强制通过 pnpm 安装,禁止使用 npm / yarn
|
||||
engine-strict=true
|
||||
# 使用 lockfile 锁定依赖版本
|
||||
lockfile=true
|
||||
# 依赖提升模式(兼容旧项目)
|
||||
shamefully-hoist=true
|
||||
# 允许在 package.json 中通过 packageManager 字段指定包管理器版本
|
||||
443
README.md
443
README.md
@@ -1,6 +1,153 @@
|
||||
# MES-UI
|
||||
|
||||
基于 [D2 Admin](https://github.com/d2-projects/d2-admin)(Vue 2 + Element UI)的企业级中后台前端项目。
|
||||
基于 [D2 Admin](https://github.com/d2-projects/d2-admin)(Vue 2.7 + Element UI)的企业级 MES 中后台前端项目。
|
||||
|
||||
---
|
||||
|
||||
## 环境要求
|
||||
|
||||
本项目通过 **[Volta](https://volta.sh/)** 和 **[pnpm](https://pnpm.io/)** 锁定开发环境版本,确保团队成员使用完全一致的 Node.js 和包管理器版本。
|
||||
|
||||
| 工具 | 锁定版本 | 作用 |
|
||||
| --- | --- | --- |
|
||||
| **Node.js** | `18.16.0` | JavaScript 运行时(`.node-version` 文件) |
|
||||
| **pnpm** | `10.33.0` | 包管理器(`package.json` → `packageManager` 字段) |
|
||||
|
||||
> 配置文件说明:
|
||||
> - `.node-version` → Volta 读取,自动切换 Node.js 版本
|
||||
> - `package.json` → `engines` 字段限制版本范围,`packageManager` 字段锁定 pnpm 版本
|
||||
> - `.npmrc` → `engine-strict=true` 强制使用锁定版本,不满足则安装失败
|
||||
|
||||
---
|
||||
|
||||
## 从零开始安装到启动
|
||||
|
||||
### 第一步:安装 Volta(如果尚未安装)
|
||||
|
||||
Volta 会根据 `.node-version` 自动安装并切换到项目所需的 Node.js 版本。
|
||||
|
||||
**Windows(PowerShell):**
|
||||
|
||||
```powershell
|
||||
winget install Volta.Volta
|
||||
# 重启终端后生效
|
||||
volta --version
|
||||
```
|
||||
|
||||
**macOS / Linux:**
|
||||
|
||||
```bash
|
||||
curl https://get.volta.sh | bash
|
||||
# 重新加载 shell 配置
|
||||
source ~/.bashrc # 或 source ~/.zshrc
|
||||
volta --version
|
||||
```
|
||||
|
||||
> 更多安装方式请参考 [Volta 官方文档](https://docs.volta.sh/guide/getting-started)。
|
||||
|
||||
### 第二步:启用 pnpm(Volta 内置支持,无需额外安装)
|
||||
|
||||
```bash
|
||||
# Volta 会根据 package.json 中的 packageManager 字段
|
||||
# 自动安装并使用 pnpm@10.33.0
|
||||
volta install pnpm@10.33.0
|
||||
|
||||
# 验证版本
|
||||
pnpm --version # 应输出 10.33.0
|
||||
```
|
||||
|
||||
> 如果没有 Volta,也可以手动安装 pnpm:
|
||||
> ```bash
|
||||
> npm install -g pnpm@10.33.0
|
||||
> ```
|
||||
|
||||
### 第三步:克隆项目并安装依赖
|
||||
|
||||
```bash
|
||||
# 克隆仓库
|
||||
git clone <仓库地址>
|
||||
cd mes-ui
|
||||
|
||||
# Volta 会在进入目录时自动检测 .node-version,
|
||||
# 提示你安装 Node.js 18.16.0(如尚未安装)
|
||||
node --version # 确认输出 v18.16.0
|
||||
|
||||
# 安装依赖(pnpm 读取 packageManager 字段确保版本一致)
|
||||
pnpm install
|
||||
```
|
||||
|
||||
> `pnpm install` 会同时校验:
|
||||
> - Node.js 版本是否在 `engines.node` 范围内(`>=18.16.0 <19`)
|
||||
> - pnpm 版本是否在 `engines.pnpm` 范围内(`>=10.33.0 <11`)
|
||||
> - 如果版本不匹配,`.npmrc` 中 `engine-strict=true` 会使安装直接失败,避免环境不一致问题。
|
||||
|
||||
### 第四步:配置环境变量
|
||||
|
||||
在项目根目录创建 `.env.development.local` 文件(此文件已在 `.gitignore` 中,不会提交):
|
||||
|
||||
```bash
|
||||
# 后台 API 地址
|
||||
VUE_APP_API=http://你的后台服务器地址/
|
||||
```
|
||||
|
||||
### 第五步:启动开发服务器
|
||||
|
||||
```bash
|
||||
pnpm serve
|
||||
```
|
||||
|
||||
浏览器会自动打开 `http://localhost:8080`(或终端提示的实际端口)。
|
||||
|
||||
---
|
||||
|
||||
## 常用命令速查
|
||||
|
||||
| 命令 | 说明 |
|
||||
| --- | --- |
|
||||
| `pnpm serve` | 启动开发服务器(自动打开浏览器) |
|
||||
| `pnpm build` | 生产环境构建 |
|
||||
| `pnpm build:preview` | 预发布环境构建 |
|
||||
| `pnpm lint` | ESLint 代码检查并自动修复 |
|
||||
| `pnpm test:unit` | 运行单元测试 |
|
||||
| `pnpm install` | 安装依赖 |
|
||||
| `pnpm add <包名>` | 添加新依赖(**禁止使用 npm install**) |
|
||||
| `pnpm remove <包名>` | 移除依赖 |
|
||||
|
||||
---
|
||||
|
||||
## 版本锁定机制
|
||||
|
||||
### Node.js 版本锁定(Volta)
|
||||
|
||||
```
|
||||
项目根目录
|
||||
├── .node-version → 18.16.0(Volta 自动读取切换)
|
||||
```
|
||||
|
||||
- Volta 进入项目目录时自动将 Node.js 切换为 `18.16.0`
|
||||
- 如果该版本未安装,Volta 会自动下载并安装
|
||||
- 传统方案(nvm)也兼容:`nvm use` 读取 `.nvmrc`,本项目同时提供 `.node-version` 供 Volta 使用
|
||||
|
||||
### pnpm 版本锁定
|
||||
|
||||
```
|
||||
package.json
|
||||
├── packageManager → pnpm@10.33.0(Corepack / Volta 识别)
|
||||
├── engines.pnpm → >=10.33.0 <11(npm/pnpm install 时校验)
|
||||
```
|
||||
|
||||
```ini
|
||||
# .npmrc
|
||||
engine-strict=true # 版本不满足 → 安装直接报错
|
||||
```
|
||||
|
||||
### 依赖版本锁定
|
||||
|
||||
```
|
||||
pnpm-lock.yaml → 锁定所有依赖的精确版本(等价于 npm 的 package-lock.json)
|
||||
```
|
||||
|
||||
> `pnpm-lock.yaml` **必须提交到 Git**,保证所有环境安装的依赖版本完全一致。
|
||||
|
||||
---
|
||||
|
||||
@@ -12,234 +159,109 @@ mes-ui/
|
||||
├── docs/ # 项目文档
|
||||
├── public/ # 静态资源(不经过 webpack 处理)
|
||||
├── src/ # PC 端业务源码
|
||||
│ ├── api/ # 接口请求层
|
||||
│ ├── assets/ # 静态资源(经 webpack 处理)
|
||||
│ ├── api/ # 接口请求层(按业务模块拆分)
|
||||
│ │ ├── _service.js # axios 请求服务实例
|
||||
│ │ └── production-master-data/ # 生产主数据模块 API
|
||||
│ ├── assets/ # 静态资源(经 webpack 处理,含 SCSS / SVG)
|
||||
│ ├── components/ # 公共组件
|
||||
│ │ ├── page-table/ # CRUD 表格便捷组合体
|
||||
│ │ └── page-dialog-form/ # 新增/编辑弹框组件
|
||||
│ ├── composables/ # 可复用逻辑函数
|
||||
│ ├── layout/ # 页面布局
|
||||
│ │ ├── useTableColumns.js # 列定义工厂
|
||||
│ │ ├── useTableButtons.js # 按钮定义工厂
|
||||
│ │ └── useI18n.js # i18n Mixin 工厂
|
||||
│ ├── layout/ # 页面布局(header-aside)
|
||||
│ ├── libs/ # 工具函数
|
||||
│ ├── locales/ # 国际化语言包
|
||||
│ ├── menu/ # 菜单配置
|
||||
│ ├── plugin/ # Vue 插件
|
||||
│ ├── router/ # 路由配置
|
||||
│ ├── locales/ # 国际化语言包(zh-chs / en)
|
||||
│ ├── router/ # 路由配置(modules/ 按业务模块拆分)
|
||||
│ ├── store/ # Vuex 状态管理
|
||||
│ └── views/ # 业务页面
|
||||
│ ├── utils/ # 通用工具(文件下载、Excel 读取等)
|
||||
│ └── views/ # 业务页面(按模块三级目录组织)
|
||||
│ ├── production-master-data/ # 生产主数据
|
||||
│ ├── system-administration/ # 系统管理
|
||||
│ ├── equipment-management/ # 设备管理
|
||||
│ ├── quality-management/ # 质量管控
|
||||
│ ├── planning-production/ # 计划生产
|
||||
│ └── data-platform/ # 数据平台
|
||||
├── src.mobile/ # 移动端业务源码
|
||||
├── .browserslistrc # 浏览器兼容配置
|
||||
├── .editorconfig # 编辑器统一配置
|
||||
├── .env / .env.development / .env.preview # 环境变量
|
||||
├── .eslintignore / .eslintrc.js # ESLint 配置
|
||||
├── .gitignore # Git 忽略配置
|
||||
├── .node-version # Volta Node.js 版本锁定(18.16.0)
|
||||
├── .npmrc # pnpm 配置(版本强校验)
|
||||
├── .postcssrc.js # PostCSS 配置
|
||||
├── babel.config.js # Babel 配置
|
||||
├── jest.config.js # Jest 单元测试配置
|
||||
├── jsconfig.json # VS Code 路径别名提示
|
||||
├── package.json # 项目依赖与脚本
|
||||
├── pnpm-lock.yaml # pnpm 依赖锁定文件
|
||||
├── pnpm-lock.yaml # pnpm 依赖锁定文件(必须提交)
|
||||
├── vue.config.js # Vue CLI 构建配置
|
||||
└── README.md # 项目说明(本文件)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 各目录详解
|
||||
|
||||
### `.github/`
|
||||
|
||||
GitHub 相关配置,包含 Issue 模板和 CI/CD 工作流(`workflows/`)。
|
||||
|
||||
### `docs/`
|
||||
|
||||
项目文档目录,存放变更日志、修复记录等 Markdown 文档。子目录 `image/` 存放文档引用的图片。
|
||||
## 项目文档
|
||||
|
||||
| 文档 | 说明 |
|
||||
|------|------|
|
||||
| [表格组件使用说明](./docs/表格组件使用说明.md) | page-table / page-dialog-form 的完整使用手册 |
|
||||
| [SCT基础表格重构设计](./docs/SCT基础表格重构设计.md) | 旧 sct-base-table → 新架构的设计文档 |
|
||||
| [Sass废弃修复](./docs/Sass废弃修复.md) | Sass 废弃警告修复记录 |
|
||||
| --- | --- |
|
||||
| [表格组件使用说明](./docs/表格组件使用说明.md) | `page-table` + `page-dialog-form` 完整使用手册 |
|
||||
| [国际化规则](./docs/国际化规则.md) | i18n 使用规范与迁移指南 |
|
||||
| [迁移提示词](./docs/迁移提示词.md) | 旧页面迁移到新方案的规则文档 |
|
||||
| [SCT基础表格重构设计](./docs/SCT基础表格重构设计.md) | 旧 `sct-base-table` → 新架构设计文档 |
|
||||
| [变更日志](./docs/变更日志.md) | 项目变更日志 |
|
||||
|
||||
### `public/`
|
||||
---
|
||||
|
||||
**静态资源目录**,文件会原样复制到构建产物中,不经过 webpack 编译。
|
||||
## 关键目录说明
|
||||
|
||||
| 子目录 | 作用 |
|
||||
|--------|------|
|
||||
| `lib/UEditor/` | 百度 UEditor 富文本编辑器(第三方库,通过 `<script>` 直接引入) |
|
||||
| `image/theme/` | 各主题的 Logo 图片和预览图(chester / d2 / element / line / star / tomorrow-night-blue / violet) |
|
||||
| `image/loading/` | 页面加载动画的 SVG |
|
||||
| `html/` | 独立 HTML 页面(如 demo.html) |
|
||||
| `index.html` | SPA 入口 HTML 模板 |
|
||||
| `icon.ico` | 网站 Favicon |
|
||||
|
||||
### `src/` — PC 端源码
|
||||
|
||||
#### `src/api/`
|
||||
**接口请求层**。封装后端 API 调用,按业务模块拆分为独立文件。
|
||||
- `_service.js` — 基于 axios 的请求服务实例
|
||||
- `_tools.js` — 请求工具函数
|
||||
- `demo.js` — 演示接口
|
||||
- `sys.user.js` — 用户相关接口
|
||||
|
||||
#### `src/assets/`
|
||||
**静态资源**,会被 webpack 处理。
|
||||
|
||||
| 子目录 | 作用 |
|
||||
|--------|------|
|
||||
| `style/unit/color.scss` | 全局颜色变量定义 |
|
||||
| `style/public.scss` | 全局 SCSS 变量、mixin、placeholder(通过 `additionalData` 自动注入每个组件) |
|
||||
| `style/public-class.scss` | 全局通用 CSS class(间距、浮动、文字对齐等工具类) |
|
||||
| `style/fixed/` | 第三方库样式覆盖(element / markdown / n-progress / vue-splitpane 等) |
|
||||
| `style/animate/` | 过渡动画样式(vue-transition) |
|
||||
| `style/theme/` | 主题切换样式,每个主题独立目录,含 `index.scss` + `setting.scss` |
|
||||
| `svg-icons/icons/` | SVG 图标文件,通过 `svg-sprite-loader` 生成雪碧图 |
|
||||
| `svg-icons/index.js` | SVG 图标自动注册脚本 |
|
||||
|
||||
#### `src/components/`
|
||||
**公共组件库**,所有可复用组件集中管理。
|
||||
### `src/components/` — 公共组件
|
||||
|
||||
| 组件 | 作用 |
|
||||
|------|------|
|
||||
| `d2-container` | 页面容器组件,提供卡片、全屏、透明等多种布局变体 |
|
||||
| --- | --- |
|
||||
| `page-table` | CRUD 表格组合体(按钮栏 + 表格 + 分页 + 高度自适应 + 帮助按钮) |
|
||||
| `page-dialog-form` | 新增/编辑弹框(表单渲染 + 校验 + i18n 自动翻译) |
|
||||
| `d2-container` | 页面容器(卡片、全屏、透明等多种布局变体) |
|
||||
| `d2-container-frame` | iframe 嵌套外部页面容器 |
|
||||
| `d2-count-up` | 数字滚动动画组件 |
|
||||
| `d2-highlight` | 代码高亮展示组件 |
|
||||
| `d2-icon` / `d2-icon-svg` | 图标组件(Font Awesome / SVG) |
|
||||
| `d2-icon-select` / `d2-icon-svg-select` | 图标选择器组件 |
|
||||
| `d2-link-btn` | 链接式按钮 |
|
||||
| `d2-markdown` | Markdown 渲染组件 |
|
||||
| `d2-module-index-banner` | 首页 Banner 展示组件 |
|
||||
| `d2-module-index-menu` | 首页菜单组件 |
|
||||
| `d2-quill` | Quill 富文本编辑器封装 |
|
||||
| `d2-scrollbar` | 自定义滚动条组件 |
|
||||
| `d2-ueditor` | 百度 UEditor 编辑器封装 |
|
||||
| `page-table` | **新** CRUD 表格便捷组合体(按钮栏 + 表格 + 分页 + 高度自适应 + 帮助按钮) |
|
||||
| `page-dialog-form` | **新** 增删改查弹框组件(表单渲染 + 校验 + i18n) |
|
||||
|
||||
> `page-table` 和 `page-dialog-form` 的详细用法见:[表格组件使用说明](./docs/表格组件使用说明.md)
|
||||
> `page-table` 和 `page-dialog-form` 是本项目核心组件,详细用法见 [表格组件使用说明](./docs/表格组件使用说明.md)。
|
||||
|
||||
#### `src/composables/`
|
||||
**可复用的逻辑函数(Composition Utilities)**。把散落在各页面中的重复 JS 逻辑抽成纯函数,组件只需调用即可。
|
||||
### `src/composables/` — 逻辑复用层
|
||||
|
||||
| 文件 | 作用 |
|
||||
|------|------|
|
||||
| `useTableColumns.js` | 列定义工厂,消除手动分配 `idx` 序号;约定 `prop: '_actions'` 为操作列 |
|
||||
| `useTableButtons.js` | 按钮定义工厂,一键生成顶部工具栏 + 行内操作按钮,自动注入权限过滤 |
|
||||
| `useI18n.js` | i18n Mixin 工厂,通过 `i18nMixin(prefix)` 注入 `key()` / `ckey()` 方法,消除每个页面手写 `T` 常量 |
|
||||
| --- | --- |
|
||||
| `useTableColumns.js` | 列定义工厂,消除手动分配 `idx`,约定 `prop: '_actions'` 为操作列 |
|
||||
| `useTableButtons.js` | 按钮工厂,一键生成工具栏 + 行内按钮,自动注入权限过滤 |
|
||||
| `useI18n.js` | i18n Mixin 工厂,通过 `i18nMixin(prefix)` 注入 `key()` / `ckey()` |
|
||||
| `useConfirmHandle.js` | 确认操作 Mixin,封装 `$confirm` + API 调用 |
|
||||
|
||||
> **为什么放在 `src/` 根目录?**
|
||||
> composable 不是 UI 组件(不需要 `<template>`),也不属于 `libs/`(通用工具库)。它是介于**组件和逻辑之间**的中间层——被多个组件调用,但本身不渲染 DOM。放在 `src/` 根目录下与 `components/`、`views/` 同级,方便一眼看到项目的公共逻辑层。
|
||||
### `src/router/modules/` — 路由模块
|
||||
|
||||
#### `src/layout/`
|
||||
**页面布局**。当前使用 `header-aside` 布局(顶栏 + 侧边栏 + 主内容区)。
|
||||
按业务一级模块拆分,examples:
|
||||
|
||||
| 子目录 | 作用 |
|
||||
|--------|------|
|
||||
| `layout.vue` | 布局主文件 |
|
||||
| `components/menu-side/` | 侧边菜单组件 |
|
||||
| `components/menu-header/` | 顶部导航菜单组件 |
|
||||
| `components/header-user/` | 顶栏用户信息下拉 |
|
||||
| `components/header-theme/` | 主题切换面板 |
|
||||
| `components/header-color/` | 主题色切换 |
|
||||
| `components/header-locales/` | 多语言切换 |
|
||||
| `components/header-fullscreen/` | 全屏切换 |
|
||||
| `components/header-search/` | 全局搜索 |
|
||||
| `components/header-log/` | 操作日志 |
|
||||
| `components/header-size/` | 字号大小切换 |
|
||||
| `components/tabs/` | 多标签页栏 |
|
||||
| `components/contextmenu/` | 标签页右键菜单 |
|
||||
| `components/panel-search/` | 全局搜索面板 |
|
||||
| `mixins/search.js` | 搜索 mixin |
|
||||
| `mixins/` | 菜单相关 mixin |
|
||||
| 文件 | 路由前缀 | 对应模块 |
|
||||
| --- | --- | --- |
|
||||
| `production-master-data.js` | `/production_configuration` | 生产主数据 |
|
||||
| `system-administration.js` | `/system_settings` | 系统管理 |
|
||||
| `equipment-management.js` | `/equipment_management` | 设备管理 |
|
||||
| `quality-management.js` | `/quality_management` | 质量管控 |
|
||||
| `planning-production.js` | `/planning_production` | 计划生产 |
|
||||
| `data-platform.js` | `/data_platform` | 数据平台 |
|
||||
|
||||
#### `src/libs/`
|
||||
**工具函数库**。
|
||||
- `util.js` — 通用工具方法
|
||||
- `util.cookies.js` — Cookie 操作
|
||||
- `util.db.js` — 本地存储(基于 lowdb)
|
||||
- `util.log.js` — 日志工具
|
||||
- `util.import.development.js` / `util.import.production.js` — 开发/生产环境动态加载
|
||||
### `src/api/` — 接口请求层
|
||||
|
||||
#### `src/locales/`
|
||||
**国际化(i18n)**。JSON 格式的语言文件,支持:
|
||||
- `zh-chs` — 简体中文
|
||||
- `zh-cht` — 繁体中文
|
||||
- `en` — 英文
|
||||
- `ja` — 日文
|
||||
- `mixin.js` — Vue 国际化 mixin
|
||||
|
||||
#### `src/menu/`
|
||||
**菜单配置**。按业务模块拆分,定义侧边栏菜单结构。`modules/` 下按 demo-components、demo-playground、demo-plugins 组织。
|
||||
|
||||
#### `src/plugin/`
|
||||
**Vue 插件**。
|
||||
- `d2admin/` — D2Admin 核心插件(初始化全局功能)
|
||||
- `error/` — 全局错误捕获
|
||||
- `log/` — 通用日志输出
|
||||
- `open/` — 新窗口打开工具
|
||||
|
||||
#### `src/router/`
|
||||
**路由配置**。`modules/` 下按 components、playground、plugins 拆分路由表。`routes.js` 为汇总路由,`index.js` 创建 Vue Router 实例。
|
||||
|
||||
#### `src/store/`
|
||||
**Vuex 状态管理**。`modules/d2admin/` 下按功能拆分为独立模块:
|
||||
|
||||
| 模块 | 作用 |
|
||||
|------|------|
|
||||
| `account` | 用户账户信息 |
|
||||
| `color` | 主题色管理 |
|
||||
| `db` | 本地数据库状态 |
|
||||
| `fullscreen` | 全屏状态 |
|
||||
| `gray` | 灰度模式 |
|
||||
| `log` | 操作日志 |
|
||||
| `menu` | 菜单状态(展开/收缩/激活项) |
|
||||
| `page` | 页面缓存与标签页 |
|
||||
| `releases` | 版本信息 |
|
||||
| `search` | 全局搜索 |
|
||||
| `size` | 字号大小 |
|
||||
| `theme` | 主题切换 |
|
||||
| `transition` | 页面过渡动画 |
|
||||
| `ua` | 用户代理信息 |
|
||||
| `user` | 用户登录态 |
|
||||
|
||||
#### `src/views/`
|
||||
**页面视图**。
|
||||
- `demo/` — 各功能展示页面(组件演示 / 插件演示 / 功能试验场)
|
||||
- `system/` — 系统级页面(首页 / 登录 / 404 / 日志 / 重定向 / 刷新)
|
||||
- `production-master-data/` — 生产配置模块(工厂区域 / 产线 / 工艺 / 产品 / 物料等)
|
||||
|
||||
> 页面按一级模块 → 二级模块 → 三级模块 三层目录组织,与 [后台Webman界面截图对照表](./后台Webman界面截图对照表.md) 中的英文命名一致。
|
||||
|
||||
#### `src/` 根文件
|
||||
|
||||
| 文件 | 作用 |
|
||||
|------|------|
|
||||
| `main.js` | PC 端应用入口 |
|
||||
| `App.vue` | 根组件 |
|
||||
| `setting.js` | 全局设置(站点标题等) |
|
||||
| `i18n.js` | 国际化初始化 |
|
||||
按业务模块父目录存放,命名规则:`{模块名}.js`。例如:
|
||||
- `production-master-data/device-category.js` → 设备类型
|
||||
- `production-master-data/factory-area.js` → 工厂区域
|
||||
|
||||
---
|
||||
|
||||
### `src.mobile/` — 移动端源码
|
||||
|
||||
基于 Vant UI 的移动端适配版本,与 PC 端共用部分业务逻辑。
|
||||
|
||||
| 文件/目录 | 作用 |
|
||||
|-----------|------|
|
||||
| `main.js` | 移动端应用入口 |
|
||||
| `App.vue` | 移动端根组件 |
|
||||
| `vant.js` | Vant UI 按需引入配置 |
|
||||
| `router/` | 移动端路由 |
|
||||
| `store/` | 移动端状态管理 |
|
||||
| `views/` | 移动端页面 |
|
||||
|
||||
---
|
||||
|
||||
### 构建配置文件
|
||||
## 构建配置文件
|
||||
|
||||
| 文件 | 作用 |
|
||||
|------|------|
|
||||
| --- | --- |
|
||||
| `vue.config.js` | Vue CLI 构建配置(多页入口、CDN、webpack 插件、主题色替换、SVG sprites、路径别名) |
|
||||
| `babel.config.js` | Babel 转译配置 |
|
||||
| `.postcssrc.js` | PostCSS 自动前缀等配置 |
|
||||
@@ -249,22 +271,51 @@ GitHub 相关配置,包含 Issue 模板和 CI/CD 工作流(`workflows/`)
|
||||
| `.browserslistrc` | 目标浏览器范围 |
|
||||
| `.editorconfig` | 编辑器缩进/换行风格统一 |
|
||||
|
||||
### 环境变量文件
|
||||
---
|
||||
|
||||
| 文件 | 作用 |
|
||||
|------|------|
|
||||
## 环境变量
|
||||
|
||||
| 文件 | 说明 |
|
||||
| --- | --- |
|
||||
| `.env` | 所有环境通用变量 |
|
||||
| `.env.development` | 开发环境变量 |
|
||||
| `.env.development.local` | 本地开发环境变量(不提交 Git,需自行创建) |
|
||||
| `.env.preview` | 预发布环境变量 |
|
||||
|
||||
---
|
||||
|
||||
## 常用命令
|
||||
## 常见问题
|
||||
|
||||
| 命令 | 说明 |
|
||||
|------|------|
|
||||
| `pnpm serve` | 启动开发服务器 |
|
||||
| `pnpm build` | 生产环境构建 |
|
||||
| `pnpm build:preview` | 预发布环境构建 |
|
||||
| `pnpm lint` | ESLint 检查并自动修复 |
|
||||
| `pnpm test:unit` | 运行单元测试 |
|
||||
### Q1:`pnpm install` 报错 "Unsupported engine"
|
||||
|
||||
Node.js 或 pnpm 版本不在 `engines` 范围内。解决:
|
||||
|
||||
```bash
|
||||
# 检查版本
|
||||
node --version # 必须为 18.16.x
|
||||
pnpm --version # 必须为 10.33.x
|
||||
|
||||
# 使用 Volta 自动切换
|
||||
volta install node@18.16.0
|
||||
volta install pnpm@10.33.0
|
||||
```
|
||||
|
||||
### Q2:启动后页面报跨域错误
|
||||
|
||||
在 `.env.development.local` 中确认 `VUE_APP_API` 指向正确的后台地址,且后台已开启 CORS。
|
||||
|
||||
### Q3:端口被占用
|
||||
|
||||
默认端口为 `8080`。如需修改,在 `.env.development.local` 中添加:
|
||||
|
||||
```bash
|
||||
PORT=8081
|
||||
```
|
||||
|
||||
### Q4:依赖安装慢
|
||||
|
||||
pnpm 默认使用 npm registry。如需加速,可配置镜像:
|
||||
|
||||
```bash
|
||||
pnpm config set registry https://registry.npmmirror.com
|
||||
```
|
||||
|
||||
@@ -1,10 +1,15 @@
|
||||
{
|
||||
"name": "d2-admin",
|
||||
"version": "1.25.0",
|
||||
"packageManager": "pnpm@10.33.0",
|
||||
"engines": {
|
||||
"node": ">=18.16.0 <19",
|
||||
"pnpm": ">=10.33.0 <11"
|
||||
},
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve --open",
|
||||
"start": "npm run serve",
|
||||
"dev": "npm run serve",
|
||||
"start": "pnpm run serve",
|
||||
"dev": "pnpm run serve",
|
||||
"build": "vue-cli-service build --report",
|
||||
"build:preview": "NODE_OPTIONS=--max_old_space_size=4096 vue-cli-service build --mode preview",
|
||||
"lint": "vue-cli-service lint --fix",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { request } from '@/api/_service'
|
||||
|
||||
const BASE = 'device_management/equipment_model/equipment_category/'
|
||||
const BASE = 'production_configuration/device_model/device_category/'
|
||||
|
||||
function apiParams (method, data = {}) {
|
||||
return {
|
||||
|
||||
@@ -15,7 +15,7 @@ export default {
|
||||
component: _import('system/function/module-index')
|
||||
},
|
||||
{
|
||||
path: 'equipment_model/equipment_category',
|
||||
path: 'device_model/device_category',
|
||||
name: `${pre}equipment_model-equipment_category`,
|
||||
meta: { ...meta, cache: true, title: '设备类别' },
|
||||
component: _import('equipment-management/equipment-model/equipment-category')
|
||||
|
||||
Reference in New Issue
Block a user