Describe the bug
When running build-storybook with Storybook 5.0.10, the paths in iframe.html to javascript assets and static/media assets have an extra / in them which makes the static storybook output not viewable. This was not a problem with Storybook 3.
To Reproduce
build-storybook -c .storybook -o build/storybook,file:// path, e.g. file:///Users/myuser/storybookdemo/build/storybook/index.htmliframe.html there is <script src="/runtime~main.HASH.bundle.js"> which will fail because that translates to file:///runtime~main.HASH.bundle.js which is obviously wrong. index.html has the right path.__webpack_require__.p+"static/media/my.svg which cause load to file:///static/media/my.svg. Expected behavior
Paths in the output folder should work so that the folder works standalone. This was the behaviour in storybook 3.
I have to now resort to this sed trickery to fix the problem:
#! /bin/bash
sed -i.bak -e 's/src="\//src="/g' build/storybook/*.html
sed -i.bak -e 's/__webpack_require__\.p+"static\/media/"static\/media/g' build/storybook/*.js
rm build/storybook/*.bak
but would obviously rather have this fixed in storybook.
@ttiurani Is this a problem in our example storybooks also? doesn't appear to be. E.g. https://monorepo-lpctgf347.now.sh/examples/html-kitchen-sink/iframe.html?id=welcome--welcome
Well don't I feel bad, I had defaultConfig.output.publicPath = "/"; in my .storybook/webpack.config.js by accident. That setting apparently affects paths in iframe.html and generated javascript bundle, but not the paths in index.html.
Sorry for the noise.
Most helpful comment
Well don't I feel bad, I had
defaultConfig.output.publicPath = "/";in my.storybook/webpack.config.jsby accident. That setting apparently affects paths iniframe.htmland generated javascript bundle, but not the paths inindex.html.Sorry for the noise.