After adding the moduleFederation configuration in rsbuild.config.ts, there is a problem with the import code generated by preview.ejs.

[lyj1994]

rsbuild.config.ts

import { defineConfig } from '@rsbuild/core';
import { pluginReact } from '@rsbuild/plugin-react';
import { pluginSass } from '@rsbuild/plugin-sass';

export default defineConfig({
  plugins: [pluginReact(), pluginSass()],
  moduleFederation: {
    options: {
      name: 'host',
      remotes: {},
      shared: ['react', 'react-dom', 'lodash', 'moment'].reduce((acc, curr) => {
        acc[curr] = {
          singleton: true,
          requiredVersion: false,
        };
        return acc;
      }, {}),
    },
  },
});

error: Uncaught TypeError: Failed to resolve module specifier "static/js/runtime~main.iframe.bundle.js". Relative references must start with either "/", "./", or "../".

After delete moduleFederation:

I found that preview.ejs uses htmlWebpackPlugin to inject file names.
https://github.com/rspack-contrib/storybook-rsbuild/blob/main/packages/builder-rsbuild/templates/preview.ejs#L76

<script type="module">
      import './sb-preview/runtime.js';
      <% htmlWebpackPlugin.files.js.forEach(file => { %>
      import '<%= file %>';
 <% }); %>

Only when moduleFederation is turned on will there be this problem.

[fi3ework]

I found that preview.ejs uses htmlWebpackPlugin to inject file names.

@lyj1994 This is by design to inject the entry to load the Storybook application. I think the issue is when module federation is configured. The assetsPrefix is changed from / to ``. Could you provide a minimal reproduction to address this issue?

[lyj1994]

https://codesandbox.io/p/github/rspack-contrib/rsbuild-codesandbox-example/csb-p2t747/draft/stupefied-zeh

I have written an example with codesanbox. Please help me take a look at this problem.