vue项目使用require.context工程化配置api

原先文件

import * as request from '@/utils/request'
import * as requestUser from '@/utils/request-user'
import * as resource from './system/resource'
import * as log from './system/log'
import * as dictionary from './system/dictionary'
import * as orgunit from './system/orgunit'
import * as smsplatform from './system/smsplatform'
import * as smsplatformlog from './system/smsplatformlog'
import * as user from './system/user'
import * as role from './system/role'
import * as mainpage from './system/mainpage'
import * as tenant from './system/tenant'
import * as dataresource from './system/dataresource'
import * as dataresourceperm from './system/dataresourceperm'
import * as parameter from './system/parameter'
import * as autonumber from './system/autonumber'
import * as orgsync from './system/orgsync'
import * as usersync from './system/usersync'
import * as orgusersync from './system/orgusersync'
import * as syncsetting from './system/syncsetting'
import * as personinfo from './system/personinfo'
import * as frametestperson from './system/frametestperson'
import * as syncuumsorg from './system/syncuumsorg'
import * as syncuumsorguser from './system/syncuumsorguser'
import * as syncuumssetting from './system/syncuumssetting'
import * as syncuumsuser from './system/syncuumsuser'
import * as upload from './upload'
import * as common from './common'

// 告警模块
import * as alarmcommon from './alarm/common'
import * as alarmhistory from './alarm/history'
import * as alarmrules from './alarm/rules'
import * as alarmaudio from './alarm/audio'

// =================================智能管控中心相关api================================
// 主页-流量管控
import * as FlowMonitorMainPage from './ai-monitor-center/flow-control/FlowMonitorMainPage'
// 智能分析
import * as Statistics from './ai-monitor-center/ai-alaysis/Statistics'
// 管控历史
import * as FlowMonitor from './ai-monitor-center/monitor-histroy/FlowMonitor'
// 消息中心
import * as messageCenter from './ai-monitor-center/message-center/messageCenter'
import * as messageCenterGlobal from './ai-monitor-center/message-center/messageCenterGlobal'
// 策略管理
import * as flowControlPolicyManagement from './ai-monitor-center/policy-management/flowControlPolicyManagement'

import * as vmspublish from './monitor/vmspublish'
import * as monitorimagemachineconfig from './monitor/imagemachineconfig'
import * as fishbone from './monitor/fishbone'
/* ================================= 全局 =============================== */
var moduleList = {}
function importAll(r) {
  console.log(r.keys())
  r.keys().forEach((item, index) => {
    assignment(r(item))
  })
}
importAll(require.context('./', true, /\.js$/))

function assignment(obj) {
  if (!Object.keys(obj).length) return
  const arr = Object.keys(obj)
  arr.forEach(key => {
    moduleList[key] = obj[key]
  })
}
console.log(moduleList)
// module.exports = moduleList
// moduleList已经拿到了所有的api的请求，以对象的方式存在，后续要实现工程化，在main.js中引入all.js; 并让vue的原型链的$api = moduleList即可；Vue.prototype.$api = api；使用封装后请求方式也是this.$api.文件名.方法

import env from '@/env'
const $env = env
// 返回cas登录启用状态
export const casStatus = () => {
  // const openCas = +process.env.VUE_APP_OPENCAS
  const openCas = +$env.OpenCas
  return !!openCas // true为启用单点登录
  // return false // false为启用普通登录
}

// 登录
export const login = (params) => {
  return requestUser.post(`login`, params)
}

// cas登录
export const casLogin = (params) => {
  return request.casGet(`oauth/cas/casLogin`, params)
}

// 登出
export const logout = (userId) => {
  // return request.get(`oauth/logout`, params)
  const params = {
    userId: userId
  }
  return request.get(`oauth/cas/logout`, params)
}
// cas登出
export const casLogout = (userId) => {
  const params = {
    userId: userId
  }
  // return request.casGet(`oauth/cas/casLogout`, params)
  return request.casGet(`oauth/cas/logout`, params)
}

// 获取用户信息
export const getUserInfo = () => {
  return request.get(`sys/index/curUser`)
}

// 用户权限信息
export const getUserPermission = (params) => {
  return request.get(`sys/index/resources`, params)
}

// 获取左侧菜单
export const getMenu = (params) => {
  return request.get(`sys/index/menu`, params)
}

// 通过接口验证是否可用
export const validateApi = (url, params) => {
  return request.get(url, params)
}

// 判断用户是否存在url
export const validateUserNameUrl = (account) => {
  return `sys/user/${account}/validate`
}

/* ================================= 模块 ===============================*/

export {
  resource,
  log,
  dictionary,
  orgunit,
  role,
  user,
  smsplatform,
  smsplatformlog,
  mainpage,
  tenant,
  dataresource,
  parameter,
  autonumber,
  dataresourceperm,
  orgsync,
  usersync,
  orgusersync,
  syncsetting,
  upload,
  personinfo,
  frametestperson,
  syncuumsorg,
  syncuumsorguser,
  syncuumssetting,
  syncuumsuser,
  common,
  // 告警模块
  alarmcommon,
  alarmhistory,
  alarmrules,
  alarmaudio,
  // 智能管控中心相关api
  FlowMonitorMainPage,
  Statistics,
  FlowMonitor,
  messageCenter,
  messageCenterGlobal,
  flowControlPolicyManagement,
  vmspublish,
  monitorimagemachineconfig,
  fishbone
}

修改后文件

var moduleList = {}
function importAll(r) {
  console.log(r.keys())
  // 获取所有的文件目录
  r.keys().forEach((item, index) => {
    assignment(r(item))
  })
}
importAll(require.context('./', true, /\.js$/))

// 将模块的数据加载进 moduleList 对象中
function assignment(obj) {
  if (!Object.keys(obj).length) return
  const arr = Object.keys(obj)
  arr.forEach(key => {
    moduleList[key] = obj[key]
  })
}
console.log(moduleList)
// 将api模块导出
module.exports = moduleList
// moduleList已经拿到了所有的api的请求，以对象的方式存在，后续要实现工程化，在main.js中引入all.js; 并让vue的原型链的$api = moduleList即可；Vue.prototype.$api = api；使用封装后请求方式也是this.$api.文件名.方法


//  以下代码应该写进一个单独的js文件中
import env from '@/env'
const $env = env
// 返回cas登录启用状态
export const casStatus = () => {
  // const openCas = +process.env.VUE_APP_OPENCAS
  const openCas = +$env.OpenCas
  return !!openCas // true为启用单点登录
  // return false // false为启用普通登录
}

// 登录
export const login = (params) => {
  return requestUser.post(`login`, params)
}

// cas登录
export const casLogin = (params) => {
  return request.casGet(`oauth/cas/casLogin`, params)
}

// 登出
export const logout = (userId) => {
  // return request.get(`oauth/logout`, params)
  const params = {
    userId: userId
  }
  return request.get(`oauth/cas/logout`, params)
}
// cas登出
export const casLogout = (userId) => {
  const params = {
    userId: userId
  }
  // return request.casGet(`oauth/cas/casLogout`, params)
  return request.casGet(`oauth/cas/logout`, params)
}

// 获取用户信息
export const getUserInfo = () => {
  return request.get(`sys/index/curUser`)
}

// 用户权限信息
export const getUserPermission = (params) => {
  return request.get(`sys/index/resources`, params)
}

// 获取左侧菜单
export const getMenu = (params) => {
  return request.get(`sys/index/menu`, params)
}

// 通过接口验证是否可用
export const validateApi = (url, params) => {
  return request.get(url, params)
}

// 判断用户是否存在url
export const validateUserNameUrl = (account) => {
  return `sys/user/${account}/validate`
}