Richard Fernandez
Richard Fernandez

Reputation: 599

Adding publicPath to Storybook React

We have our Storybook React project in a subpath (http://example.com/storybook) but the production version is looking for assets at the top level (http://example.com/font.woff).

I was reading that you could add a publicPath property or add an override on __webpack_public_path__ but I can't see where to do this?

Upvotes: 4

Views: 4987

Answers (2)

AamirR
AamirR

Reputation: 12218

I am using Vite to build storybook, instead of publicPath I had to set config.base in main.js, like so:

export default {
  ...
  viteFinal: (config) => {
    config.base = '/storybook-subdir/';
    ...
    return config
  }
};

You can also define a variable and use a dynamic value, for example

config.base = process.env.PUBLIC_DIR || config.base;

Finally build storybook

PUBLIC_DIR=/storybook-subdir/ build-storybook

Upvotes: 0

Gaspar Teixeira
Gaspar Teixeira

Reputation: 1267

I had a similar issue with Storybook. Please check the options for build command line. I solved my problem using this link, specially

build-storybook --static-dir storybook

https://storybook.js.org/docs/configurations/cli-options/

Upvotes: 2

Related Questions