Vuex扫描自定义文件夹下的所有文件

解决问题：当我们规范 model 统一放在某个文件夹下，且可以通过子文件夹分类。当新加model时又不想去修改别的地方。

代码

// /src/sotre/index.js

import { createStore } from 'vuex';

const allComponents = require.context('.', true, /\.*[^(index)]\.js$/);
const resComponents = {};
allComponents.keys().forEach((fileName) => {
  const moduleName = fileName.split(/\.|\//).at(-2);
  if (!fileName.includes('index.js')) {
    const comp = allComponents(fileName);
    if (resComponents[moduleName]) {
      const see = `/src/store/${fileName}`;
      throw new Error(
        `already exist same namespace:${moduleName} in store. See:${see.replace(
          '/./',
          '/',
        )}`,
      );
    }
    resComponents[moduleName] = comp.default;
  }
});

export default createStore({
  state: {},
  mutations: {},
  actions: {},
  getters: {},
  modules: resComponents,
});

 

作用：

1、扫描当前目录及子目录下的所有文件。

2、剔除所有的 index.js文件。

3、把文件名作为namespace，所以 尽管不在一个文件夹中，文件名仍不可以重复。