做项目前路由还有其他文件的封装

1.路由的封装

在路由的index.js文件中：
    import Vue from 'vue' 
    import Router from 'vue-router' 
    Vue.use(Router) 
    export default new Router({
        routes:[   //路由列表
            path:'/',
            name:'',
            component:'路径', 
            redirect:'',  //重定向
            children:[ //嵌套路由，path不用/ ]
        ]
    });
 嵌套路由中的子路由就使用<router-view></router-view>显示
 在main.js文件中：
     import router from 'router.js文件路径'
     在new Vue({router})

2.Storage封装

cookie、localStorage、sessionStorage的区别：
    存储大小：cookie 4K    storage 5M
    有效期：cookie有有效期，storage是永久存储
    cookie会发送到服务器端，存储在内存中，storage只存储在浏览器
    cookie有路径限制，storage只存储在域名下
为什么要封装storage:
    storage有api，但只是简单的key/value的形式
    storage只能一次性清空，不能单个清空
    storage只储存字符串，需要手工转换为json对象
封装的方法：
    getStorage(){ //获取整个storage并把他JSON.parse转成JSON字符串 } 
    获取Storage的方法：window.sessionStorage.getItem(key)
    getItem(key,module_name){ 可以通过key获取也可以通过模块获取 } 
    setItem(key,value,module_name){设置storage} 
    设置Storage的方法：window.sessionStorage.setItem(key,value(注意转成字符串))
    clear(key,module_name){通过重新设置清空单个值} 

3.Axios封装

axios.all的应用场景：loading的时候使用，当多个接口需要等待相应成功时就使用 
接口错误拦截：
    在main.js里引入axios 
    //响应拦截器
    axios.interceptors.response.use(function(res){}) 
    //main.js里跳转页面 
    window.location.href = '/#/login' 
    //设置基本路径和响应超时时间
    axios.defaults.baseURL = '';   //路径
    axios.defaults.timeout = 8000;  //8秒

4.接口环境配置

 开发上线的不同阶段，需要不同的配置 
 跨域方式的不同，配置不同
 打包时要统一注入环境参数，统一管理环境。输出不同的版本包
 第一步：
     给package.json里的环境添加mode属性，如：
          "serve": "vue-cli-service serve --mode=development"  （注意不加引号）
第二步： 
    创建env.js文件
    定义baseURL
    通过判断process.env.NODE_ENV == 'mode'的值在判断当前的baseurl
    导出url
注意：这种是通过其他跨域的方式判断url，代理的话只能在vue.config.js里修改
自定义环境变量：
    "te_st": "vue-cli-service serve --mode=te_st"  （注意不加引号）
    在项目文件下创建.env_te_st文件，内容：NODE_ENV='te_st'