Storybook: How do I update my webpack config to show the original source map?

Viewed 335

I've been trying every variation of 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',

    };
  },
};

enter image description here

After restarting the server with start-storybook, it indeed changes but it's not showing me the original file contents. When I click into the file line, it shows the compiled code, not my original source code:

enter image description here

This is how I'm starting storybook:

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

0 Answers
Related