你是怎么开发项目的？

你都做过哪些项目，你是怎么开发项目的？

​ 我开发的项目是每时每刻，这个项目是我一个人开全程开发的，、
（这里尽量说是自己单独开发，面试几率会大一些）

​ 第一开始项目前，我会先选择框架，我选择的是vue来开发这个项目，因为vue开发起来方便不想react那样需要自己写路由啊公共存储啊什么，vue框架是吧大部分东西配好了，，而且我也比较喜欢vue。

​ 再者是我所用到的技术栈应为最近开发，因为我这个项目是移动端，所以我首选vant,vant框架他有许多很好用的组件，是我比较喜欢的，比如loading加载，当然有一些loading图肯定是要自己加上去，闲的整个项目，更加美感，至此来提高用户体验。

​ 再有就是配置多环境变量，这个东西，虽然配置起来有一些麻烦，但是为了后期的方便，还是要配置的，这个多环境变量需要在根目录下创建三个.env的文件夹，分别对应的开发，生产， 测试环境变量；

​ 内部的代码为：

NODE_ENV = "development";
VUE_APP_MODE = "prod" //这里是我开发环境的变量
VUE_APP_API_URL = "http://11111111.com/api/demo"//这里是如果上边的是开发变量，
//这里就是开发的路径测试就是测试的路径

然后在网络请求模块里设置接口环境，就是创建axios的实例的baseURL:PROCESS.env.VUE_APP_API_URL

到这之后就是网络封装模块了这是我开发中也是必须的一向，等下我再娓娓道来，

设置好axios的请求头之后，需要在package.json配置我启动项目时候的命令名称以及启动命令，完成之后

就可以npm run ***这个是打包名称就是配置.env时候VUE_APP_MODE后面跟着的环境变量名称。到这多环境变量就配置成功了。

​ 然后就是封装网络请求模块了，毕竟vue是一个多模块开发，没有axiso的第二次封装怎么可以，为什么说他是第二次封装，因为axios是对ajax进行了第一次封装，让请求接口更加简便一目了然，但是后期项目请求的接口肯定不止一两个，这时候就需要我来给他进行第二次封装，所谓第二次封装，就是把请求接口统一放在一个文件内管理，多个方法运用一套请求，既然是模块请求那肯定是需要自己的文件夹，在src内创建utils(实用程序)，然后在创建一个network文件夹，内部有三个文件第一个Url.js这个文件就是我统一管理的接口路径，还有就是我所用到的请求方式，最常用的两种GET和POST，先写上，还有其他的后续再加，然后就是core.js文件，这里就要对我自己的axios进行封装了，既然封装axios，那就肯定是要引入axios ，这里我还引入了请求方式，是以解构赋值的方式，import {METHOD} from “./Url.js”,到这里时候，我前面有提到过baseURL的设置，就在这里设置，

var BASEURL = PROCESS.env.VUE_APP_API_URL
const axiosInstance = axios.create({
  baseURL: BASEURL, //默认会拼接到请求路径前面
  timeout: 20000,
});

然后，设置请求拦截器，让她弹出个loading或者携带token，然后响应请求，收起loading或者对请求到的数据做点什么，

​ 然后，对请求格式做一个模板

export function request(method, url, params) {
  switch (method) { // 对method进行一个判断
    case METHOD.GET: //如果是GET就用GET方式请求
      return GET(url, params);
    case METHOD.POST: //如果是POST就用POST方式请求
      return POST(url, params);
      //如果有PUT就再加一个PUT的case,就行了
  }
}

// 请求方式
function GET(url, params) {
  return axiosInstance.get(url, params);
}

function POST(url, params) {
  return axiosInstance.post(url, params);
}

然后就是对我的请求方法进行封装，index.js文件 就所谓的入口文件

引入core,引入url

import {request} from “./core”;

import {METHOD , URL} from “./Url”;

这里要有请求方式和请求路径，然后抛出一个对象，把这个对象设置成Vue的原型

  install(Vue) {//这里我用到了一个install的方法，这是因为我在main里引入了这个index.js的接口文档，然后				Vue.use(API) ，因为我写了use，use被调用会默认执行install
    Vue.prototype.$API = this;
  },

然后就是方法了

login(data){
  return request(METHOD.POST,URL.LOGIN,data);
}

用方法，我就可以直接在组件中this.login()使用，网络封装虽然有点麻烦但是我后期维护起来更好维护，既然是移动端，那肯定是有rem的，rem布局是非常流行的，所以我也使用了rem的布局，来让我的项目更加的实用

最后就是一些项目里的常用功能，比如上拉懒加载，吸顶，或者回到顶部什么的