# web_15

**Repository Path**: fanhangcheng/web_15

## Basic Information

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

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-10-07
- **Last Updated**: 2021-08-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

黑马移动端团队实战实操

---

一、项目初始化

项目初始化：

这个过程：建议导师进行讲解

1、初始化项目

- 安装脚手架
  - npm install -g @vue/cli
- 启动交互式命令行创建项目
  - vue create 项目名称
- 创建项目

2、安装并配置项目中使用的依赖

注意：

1、可以使用命令行的方式进行安装

2、也可以通过图像化界面的形式进行安装， 根据个人爱好选择，步骤略……

3、在安装时注意是开发依赖还是运行依赖



001 - 安装 Vue 组件库 vant

1. 安装 vant ： npm i vant -S
2. 按需导入
   - npm i babel-plugin-import -D
   - 在 babel.config.js 文件中进行配置

    module.exports = {
      presets: [
        '@vue/app'
      ],
      // 配置自动按需引入组件
      plugins: [
        ['import', {
          libraryName: 'vant',
          libraryDirectory: 'es',
          style: true
        }, 'vant']
      ]
    }

1. 在 src 目录下创建 plugins 目录
2. 在 plugins 目录下创建 vant.js 文件，统一对按需使用的 vant 组件进行管理
3. 初始化 vant.js 中的代码结构

    // 导入 Vue
    import Vue from 'vue'
    
    // 导入 Button 组件
    import { Button } from 'vant'
    
    // 挂载 Button 组件
    Vue.use(Button)

1. 在 main.js 文件中导入 vant.js 文件

    // main.js
    
    // 导入按需加载的 vant 组件
    import './plugins/vant'



002 - 安装 axios

1. 安装 axios : npm install axios
2. 配置 axios

    // 导入axios
    import axios from 'axios'
    Vue.prototype.$http = axios



003 - 安装 less 和 less-loader

- npm install less
- npm install less-loader --save-dev

3、梳理项目目录

1. 对项目文件进行重置、删除不必要的文件
2. 步骤 略……

4、路由配置

- 组长配置基础的路由

5、将代码传到 github 或者 码云





---

---

                                                                         同学开始进入开发

---

---



二、同学们开发步骤

1. 组长根据 项目初始化 步骤，将代码传到 github 或者 码云
2. 组长基于 master 分支创建 develop 分支
   - develop 分支： 开发基准分支，所有功能分支必须基于这个进行创建
3. 组员认领需求
4. 组员 clone 仓库，基于 develop 创建功能分支 feature，例如：feature/index
5. 进行需求开发，开发过程中注意记录 bug以及修复过程 
6. 开发中出现问题，优先自己解决，然后小组内解决
7. 开发完毕后，组长协同组员将代码合并到 develop 分支
   - 如果合并到 develop 分支后代码出现了问题
   - 需要基于 develop 分支 创建 fix 分支进行修改 bug，例如: fix/indexbug
   - 然后将错误代码合并到 develop
8. 将 develop 分支代码合并到 master 分支
   - 如果合并到 master 分支后代码出现了问题
   - 需要基于 master 分支创建 hotfix  分支进行修改 bug，例如：hotfix/indexbug
   - 然后将错误代码合并到 develop 以及 master 分支 
9. 项目开发完毕
10. 项目复盘 
    - 总结遇到的协作问题
    - 总结遇到了什么 bug ，bug 如何解决的
11. 团队协作完毕