Plugin插件自动导入

插件自动导入的方式。

require.context()

该方式是JS原生支持。

function vue_require(vue: any) {
  const SELF_FILENAME = './manager.ts';
  const modules = require.context('./', false, /.ts$/);
  const files = modules.keys();
  
  files.forEach((filename: string) => {
    if (filename === SELF_FILENAME) {
      return;
    }
    vue.use(modules(filename).default);
  });
}

glob()

该方式需要依赖glob库，适用于NodeJS。

import glob from 'glob';

export default <T> (app: T) => {
    glob("src/plugins/**/*.ts", (err: Error | null, matches: string[]) => {
        console.log(err, matches)

        matches.forEach(it => {
            if (it.indexOf("PluginManager.ts") > 0) return

            import(it.replace("src/plugins/", "./")).then(mod => mod.default && mod.default(app));
        })
    })
}

import.meta.glob()

该方式仅在vite框架下才可行，底层应该也是使用的glob插件。

function vite_import(vue: Vue) {
  const modules = import.meta.glob("./*.ts");
  
  for (const path in modules) {
    if (import.meta.env.DEV) {
      // 方法一：通过path导入
      // @vite-ignore
      import(path as string).then((mod: any) => {
        vue.use(mod.default);
      });
    } else {
      // 方法二：modules是一个Map,通过key可以得到对应的模块
      modules[path]().then(module => {
        // console.log(`module[${path}]`, module);
        vue.use(module.default);
      });
    }
  }
}