# web-common

**Repository Path**: twobear/web-common

## Basic Information

- **Project Name**: web-common
- **Description**: （前端技术栈：react +antd + dva + umi）为了统一维护各项目中前端框架的公用的组件和方法，于是将它们抽离出来，作为一个独立项目。此项目只用于维护公用文件，不能独立运行
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 1
- **Created**: 2019-08-22
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# web-common 

#### 介绍

为了统一维护各项目中，前端框架的公用的组件和方法，于是将它们抽离出来，作为一个独立的项目

此项目只是用于统一维护这些公用文件，不能独立运行。

#### 软件架构

前端技术栈：react +antd + dva + umi

#### 使用说明

1. **下载 `webCommon` 项目**

将此项目下载到本地，放在与你的项目文件夹同级的文件夹

比如，我这个文件夹下，有 ecaas 、 gas、oa、site 等项目，那么就将 webCommon 项目放在这个文件夹下：


![输入图片说明](https://images.gitee.com/uploads/images/2019/0822/145214_98f75e62_5232925.png "1566453997942.png")



2. **修改具体项目的 `.umirc.js` 文件**

打开某个项目（比如 `ecaas` 项目)，修改项目的 `.umirc.js` 文件内容如下：

```javascript
import routerArr from './config/router.config';
import theme from './config/theme';
import commonConfig from '../webCommon/.umirc';

const config = commonConfig(__dirname);
config.routes = routerArr;
config.theme = theme;
module.exports = config;
```

>  注意：引入正确的 `webCommon/.umirc` 文件路径

另外，如果你的项目文件夹包含多个子项目，比如 `gas` 项目中，子项目  `detection`  的 `.umirc.js` 文件位置是 `gas/detection/.umirc.js` ，那么它的文件内容就应该是：

```js
import routerArr from './config/router.config';
import theme from './config/theme';
import commonConfig from '../../webCommon/.umirc';

const config = commonConfig(__dirname);
config.routes = routerArr;
config.theme = theme;
module.exports = config;
```

3. **安装具体项目依赖，并运行该项目**

* 进入某个项目（比如 `gas/detection` 项目）

```bash
$ cd gas/detection
```

* 安装依赖

```bash
$ yarn 
```

* 运行项目

```bash
$ yarn start
```

4. **打开浏览器，查看效果**

比如 `ecaas` 项目，访问链接： http://localhost/saas/

> 注意：之所以可以使用上面的链接访问，是因为得本地安装了 nginx ，并在 nginx.conf 配置了域名重定向
>
> 例如：本地通过 `yarn start` 启动的开发服务，本来这样访问的：http://localhost:8000 ，但由于在 nginx.conf 将 /saas/ 重定向到 http://localhost:8000  ，并且 nginx 服务运行在 80 端口，所以访问 http://localhost/saas/ 也就是访问 http://localhost:8000