js 工程化导入

• 在一些前端项目中，可能会做一些国际化处理，涉及国际化，就会存在一个比较明显的问题，那就是 国际化配置
• 所有的国际化配置写在同一个配置文件中，会造成不易维护，这时需要进行文件拆分，使用 es6的模块化 进行导入、导出，在配置文件较少的时候可以这么操作，但在配置文件过多的时候，这种方式是不便利的，所以需要使用 js的工程化 导入功能

  /**
  * 获取 ./ 文件下所有文件
  * @param {string}：路径
  * @param {boolean}：是否拷贝子文件内容
  * @param {RegExp}：以 .js 结尾的所有文件
  */
  const modules = require.context('./', true, /\.js$/i)

  export default modules.keys().reduce((reduce, key) => {
    return { ...reduce, ...modules(key).default }
  })

文件结构

国际化配置

// 请求
const request = {
  'common.request.loading': '数据加载中',
  'common.request.error': '数据加载失败'
}

// 导出
const exportConfig = {
  'export.loading': '数据导出中...',
  'common.export.error': '数据导出失败'
}

// select
const select = {
  'select.all': '全选'
}

// 请求参数
const queryParams = {
  'queryParams.error': '请求参数异常',
  'queryParams.temporalInterval.cannotBeLongerThanOneMonth': '时间区间不能超过一个月'
}

export default{ request, exportConfig, select, queryParams }

​

若有收获，就点个赞吧