platform/io.sc.platform.mvc.frontend/src/boostrap.ts

import packageJson from '../package.json';
import { createApp } from 'vue';
import platform from 'platform-core';
import { ApplicationInitializer, ComponentManager } from 'platform-core';
import localMocks from './mock';
import localI18nMessages from './i18n';
import localMenus from './menus/menus.json';
import localRoutes from './routes/routes.json';
import localComponents from './components';
import App from './App.vue';

// 以下导入 css 的语句在具体的前端项目中生效
// platform-core 提供的模版通过执行 pnpm sync 命令时,会替换掉 , 以便生效
// 导入 platform-core css
import 'platform-core/dist/css/platform-core.css';
// 导入 tailwind utilities css
import 'tailwindcss/utilities.css';
// 导入 quasar-ui-qmarkdown css
import '@quasar/quasar-ui-qmarkdown/dist/index.css';

// 设置远程组件加载器
// 覆盖 platform-core 包中的 remoteComponentLoader 函数
// 只有在主前端项目中编写如下的 remoteComponentLoader 函数才能实现 webpack Module Federation 的 shared 功能
ComponentManager.setRemoteComponentLoader((moduleName: string, componentName: string): any => {
  return async () => {
    await __webpack_init_sharing__('default');
    const container = window[moduleName];
    if (container) {
      await container.init(__webpack_share_scopes__.default);
      const factory = await window[moduleName].get(componentName);
      return factory();
    } else {
      throw new Error('window["' + moduleName + '"] is undefined!');
    }
  };
});

//初始化平台
ApplicationInitializer.initialize({
  moduleName: packageJson.name,
  moduleVersion: packageJson.version,
  localMocks: localMocks,
  localI18nMessages: localI18nMessages,
  localMenus: localMenus,
  localRoutes: localRoutes,
  localComponents: localComponents,
  callback: () => {
    const app = createApp(App);
    app.use(platform);
    app.mount('#app');
  },
});