如何正确地在网页上添加图像路径以从故事书加载图像

我有一个包含以下文件夹树的项目:

- myProject
    - .storybook
        - Project.js
        ...
        - webpack.config.js
    - storybook-static
        - images
            - logo.svg

这个 myProject/。网页/故事书。配置。js 文件看起来像:

const path = require('path');

module.exports = async ({ config, mode }) => {
// `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
// You can change the configuration based on that.
// 'PRODUCTION' is used when building the static version of storybook.

// Make whatever fine-grained changes you need
config.module.rules.push({
  test: /\.scss$/,
  use: ['style-loader', 'css-loader', 'sass-loader'],
  include: path.resolve(__dirname, '../'),
});

// Return the altered config
return config;

}

这个项目。js文件包含以下内容:

import { create } from '@storybook/theming';

export default create({
  base: 'light',
  brandTitle: 'My Project',
  brandUrl: '',
  brandImage: '/images/logos/logo.svg',
});

我正在部署storybook,我遇到的问题是徽标。svg文件,服务器不会加载它。运行storybook build时,一切正常,每个映像都正确加载,但在部署时,映像在Project中调用。js没有。这可能是因为服务器不是从域根目录提供根文件夹,而是从子目录提供。我尝试了在storybook网页包文件中的一些更改,添加了配置。它的输出,与此类似:

const path = require('path');

module.exports = async ({ config, mode }) => {
// `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
// You can change the configuration based on that.
// 'PRODUCTION' is used when building the static version of storybook.

// Make whatever fine-grained changes you need
config.module.rules.push({
  test: /\.scss$/,
  use: ['style-loader', 'css-loader', 'sass-loader'],
  include: path.resolve(__dirname, '../'),
}),


config.output = {
  path: path.join(__dirname, 'storybook-static'),
  publicPath: path.resolve("../storybook-static/")
};




 // Return the altered config
 return config;
}

但这也不管用。

有什么想法吗?