we-tree v1.0.0
Xin_RC_front 环境搭建
node.js（安装最新版本即可）
npm（用 cnpm 或 yarn 能节约你安装依赖的时间）
git
clone 项目代码：git clone http://192.168.1.2:10101/r/Xin_RC_front.git进入 Xin_RC_front 目录
npm install 安装插件
npm start 启动本地开发环境
框架介绍
使用Node.js、Umi、React(React-router，Redux)、Dva.js、Antd、css-modules 开发Node.js
Dva.js 扩展React框架
React、Redux
Ant-desgin Web端UI框架
Umi 企业级react应用框架,蚂蚁金服的底层前端框架
Ant-design-pro 基于 React 的中后台管理控制台的脚手 (目前使用2.x版本)
css-modules css模块化方案
相关技术点可参考:
Dva.js:https://dvajs.com/guide/
Ant-design-pro:https://v2-pro.ant.design/index-cn
css-modles：https://github.com/css-modules/css-modules 、https://v2-pro.ant.design/docs/style-cn
其他：lodash JavaScript 工具库 https://www.lodashjs.com/docs/latest
项目程序结构
该项目目前包含主要模块：项目策划
组件库
质量管理
模型管理
现场巡检
巡检GIS
项目目录结构说明
Xin_RC_front
├── config // 编译时配置文件 同 .umirc.js
│ ├──config.js // 基础配置
│ ├──plugin.config.js // 插件配置
│ └──router.config.js // 路由配置
├── mock // 本地模拟数据
├── scripts // 构建相关
├── src // 约定 src 为源码目录
│ ├── assets //本地静态资源
│ ├── components // 业务通用组件
│ ├── e2e
│ ├── layouts // 通用布局
│ ├── models // 全局model
│ ├── pages // 业务页面入口和常用模板
│ │ ├── document.ejs // html模板
│ │ ├── Authorized.js // 权限组件
│ │ ├── 404.js // 错误处理页
│ │ ├── Api // 组件库模块
│ │ ├── Plan // 项目策划模块
│ │ ├── Quality // 质量管理模块
│ │ ├── QualityForm //
│ │ ├── QualityModel //
│ │ ├── Patrol // 现场巡检模块
│ │ ├── GIS // 巡检GIS模块
│ │ ├── User // 用户登录
│ │ ├── Message // 消息通知模块
│ │ └── ModelManage // 模型管理
│ ├── services // 后台接口服务
│ ├── utils // 工具库
│ ├── app.js // 运行时配置文件
│ ├── global.js
│ ├── global.less // 约定的全局样式文件，自动引入件
│ └── manifest.json // 扩展配置
├── .gitignore // git 忽略项
├── .eslintignore // 语法检查忽略配置
├── .eslinttrc.js // 语法规范
├── package.json // 包依赖配置
└── README.md // Xin_RC_front说明文件
其他说明
路由：
约定式路由：umi 会根据 pages 目录自动生成路由配置
配置式路由：在config/config.(ts|js) 配置文件中的 routes 属性，此配置项存在时则不会对 src/pages 目录做约定式的解析该项目采用配置式路由
src/global.(css|less|sass|scss)：此文件不走 css modules，且会自动被引入，可以在这里写全局样式，以及做样式覆盖。
models：
在 umi 中，挂载了 dva 的插件之后 models 下的文件会被默认当做 dva model 引入，所以不再需要在 models/index.js 中来手动挂载 model。
运行程序
执行命令：npm install
执行命令：npm start
5 years ago