javascript - Storybook：如何更新我的 webpack 配置以显示原始源映射？

Question

我一直在尝试各种变化devtool: [option]：

module.exports = {
  stories: ['../components/**/*.stories.@(js|mdx)'],
  addons: ['@storybook/addon-essentials', '@storybook/addon-a11y'],
  webpackFinal: async (config, { configType }) => {
    const file_loader_rule = config.module.rules.find((rule) =>
      rule.test.test('.svg')
    );
    file_loader_rule.exclude = /\.svg$/;
    config.module.rules.push({
      test: /\.svg$/,
      use: ['@svgr/webpack', 'url-loader'],
    });

    return {
      ...config,
      devtool: 'eval-source-map',

    };
  },
};

用 重新启动服务器后start-storybook，它确实发生了变化，但它没有向我显示原始文件内容。当我单击文件行时，它显示的是编译后的代码，而不是我的原始源代码：

这就是我开始故事书的方式：

    "start": "start-storybook -p 9009",

标签： javascriptwebpackstorybook