# ccms

**Repository Path**: Rtder/ccms

## Basic Information

- **Project Name**: ccms
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-01-26
- **Last Updated**: 2023-06-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README


# Project

### 环境准备
> nodejs v16.1.0

### 语法
> vue3 CompositionAPI [link](https://www.vue3js.cn/docs/zh/guide/composition-api-introduction.html)

### 目录结构
```
── index.html  //首页 静态资源 标题等相关
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
│   └── favicon.ico
├── readme.md //说明文档
├── src
│   ├── App.vue 
│   ├── api
│   │   ├── fetch.js //请求封装
│   │   ├── index.js //index包导出 (只用这个即可)
│   │   └── port
│   │       └── common.js //对应的接口不限这一个
│   ├── assets
│   │   └── logo.png //资源
│   ├── components //组件
|   ├── locale //国际化
│   │   └── en/zh_cn // 根据模块在对应语言文件夹下新增国际化内容
│   ├── hooks
│   │   └── useXXX.js //hook useXXX vue3 CompositionAPI
│   ├── index.css //公用样式
│   ├── main.js
│   ├── plugins //插件
│   │   ├── api.js
│   │   └── element.js
│   ├── router //路由
│   │   └── index.js
│   ├── store //vuex
│   │   ├── common
│   │   │   └── index.js //不同的store 可以模块化
│   │   └── index.js //主store
│   ├── utils
│   │   └── common.js //工具
│   └── views //页面
│       ├── layout.vue 
│       └── login.vue
├── tailwind.config.js //tailwind配置
├── vite.config.js //vite配置
└── yarn.lock
```

### 开发相关命令行

- 初始化

```shell
yarn
```
    
- 运行

```shell
yarn dev
```

- 打包

```shell
yarn build
```


### 代码标准

- /views
    - *.vue 一定是一个路由页面 不要放任何组件
    - *.vue 如果使用组件 对应的在/components下创建 /*文件夹 组件放在这个文件夹了
    - 主从组件最多就是两级关系 也就是 路由页面 -> 组件  
- /components
    - 公用组件不需要单独创建文件夹 但是命名要明确
    - 组件不要套的太深 组件和组件也是最多两级关系: 路由页面组件 -> 内部组件(这个组件就不要再嵌套了组件了)
- /store
    - 除了共用的 每个路由页面都有一个一个对应的module
    - 对应的module
        - 互斥关系 设置一个{xxx:true,xxx1:true}
        - 缓存的数据 设置一个{xxx:any}
        - 对应设置相应的方法
- 书写
    - data|computed snake(蛇形 xx_xx) eg:user_name
    - function  camel(小驼峰 xxxXx) eg:setName
    - hook useXXX eg: useUpload
    - scss 响应式布局 flex 规划好关系少用!important
    - fontSzie 1920*1080 html style fontSize: 16px为准 全部使用rem (已添加相关转换插件，根据相关参数自动缓缓rem，书写时直接按照设计稿中数值进行书写即可，相关配置参考：postcss.config.js)


### git地址

http://111.230.200.126:18080/struggler/shanghai.git  dev