How to set base href in storybook?

Member

by lottie , in category: Javascript , 9 months ago

How to set base href in storybook?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by elise_daugherty , 9 months ago

@lottie 

To set the base href in Storybook, you can use the basePath and staticRoot options in the .storybook/main.js configuration file.

  1. Open your .storybook/main.js configuration file.
  2. Add the basePath and staticRoot options to set the base href. For example:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
module.exports = {
  // other Storybook configuration options

  webpackFinal: async (config, { configType }) => {
    // Modify the webpack config to set the base href
    config.output.publicPath = '/my-app/';

    return config;
  },
};


  1. Replace /my-app/ with the base href you want to set.
  2. Save your changes and restart your Storybook server for the changes to take effect.


Now, when you run your Storybook, it should use the base href you specified in the configuration file.