自动预加载资源

当加载远程模块时，会自动预加载相应的远程模块资源。

安装

该运行时插件由 @module-federation/auto-preload 提供

npm

yarn

pnpm

bun

npm add @module-federation/auto-preload --save

使用

此插件可在运行时阶段或构建插件中应用。你可以根据你的场景灵活选择。

Rspack

Webpack

Module Federation Runtime

rspack.config.js

const {ModuleFederationPlugin} = require('@module-federation/enhanced/rspack');

new ModuleFederationPlugin({
  // other options
  runtimePlugins: [
    require.resolve('@module-federation/auto-preload')
  ]
});

参数

类型: Partial<PreloadConfig>
默认值: undefined
描述: 控制预加载资源行为

该配置与 preloadRemote 一致。

使用示例：

app.tsx

import { init } from '@module-federation/runtime';
import autoPreloadPlugin from '@module-federation/auto-preload';
init({
  name: '@demo/app-main',
  remotes: [
    {
      name: '@demo/app2',
      entry: 'http: //localhost:3006/mf-manifest.json',
      alias: 'app2',
    },
  ],
  plugins: [autoPreloadPlugin({
    // 默认值会通过 script 来预加载 js 文件，可通过 useLinkPreload: true 来修改此行为
    useLinkPreload: false
  })],
});

ON THIS PAGE

自动预加载资源#

安装#

使用#

参数#

自动预加载资源

安装

使用

参数