Unable to host Storybook on subpath

Question

I have a storybook for my react components, and when trying to host the static build of story book at root path (ie: https://some-domain.com/ ), then the storybook works fine. However, when trying to host at a sub path such as https://some-domain.com/subpath I get error below from console.

Uncaught SyntaxError: Invalid regular expression: /[ªµºÀ-°-ʹͶͷͺ-
ͽͿΆΈ-ΊΌΎ-ΡΣ-ϵϷ-ÒÒŠ-Ô¯Ô±-Õ–Õ™Õ -Öˆ×-תׯ-ײؠ-يٮٯٱ-Û“Û•Û¥Û¦Û®Û¯Ûº-Û¼Û¿ÜÜ’-ܯÝ-ޥޱߊ-ߪß
´-ঀঅ-ঌà¦à¦à¦“-নপ-রলশ-হঽৎড়à§à§Ÿ-à¨à¨à¨“-ਨਪ-ਰਲਲ਼ਵਸ਼ਸਹਖ਼-
ੜਫ਼ੲ-ੴઅ-àªàª-ઑલଳଵ-ହଽଡ଼à­à­Ÿ-ୡୱஃஅ-ஊஎ-à®à®’-கஙசஜஞடணதந-
பம-ஹà¯à°…-ఌఎ-à°à°’-నప-హఽౘ-ౚౠౡಀಅ¸²à¸³à¹€-ๆàºàº‚ຄຆ-ຊຌ-ຣລວ-
àï­ï­ƒï­„ï­†-ﮱﯓ-ï´½ïµ-ï¶ï¶’-ﷇﷰ-ﷻﹰ-ﹴﹶ-ﻼＡ-Ｚï½-ｚｦ-ﾾￂ-ￇￊ-ï¿ï¿’-ï¿—ï
¿š-ï¿œ]/: Range out of order in character class
    at new RegExp (<anonymous>)
    at Module.<anonymous> (vendors~main.ba0ee86f12448108b672.bundle.js:1)
    at Module.ia (ruxitagentjs_ICA2SVfgjqru_10201200909073022.js:308)
    at __webpack_require__ (runtime~main.ba0ee86f12448108b672.bundle.js:1)
    at Object.<anonymous> (vendors~main.ba0ee86f12448108b672.bundle.js:1)
    at Object.ia (ruxitagentjs_ICA2SVfgjqru_10201200909073022.js:308)
    at __webpack_require__ (runtime~main.ba0ee86f12448108b672.bundle.js:1)
    at Object.<anonymous> (vendors~main.ba0ee86f12448108b672.bundle.js:1)
    at Object.ia (ruxitagentjs_ICA2SVfgjqru_10201200909073022.js:308)
    at __webpack_require__ (runtime~main.ba0ee86f12448108b672.bundle.js:1)

Base on what I understand, it seems like SB is trying to find some script at the root path instead of subpath, and since the static folder is served under the subpath, it won't be able to find what it's looking for in the root bath. Do correct me on this if I'm wrong. After some googling, I tried modifying the tag in the iframe.html file to have src pointed to the subpath but that doesn't seem to help either. Can someone help me on this please?

Answer 1

You can set the publicPath in iframe-webpack-config.js which should solve your issue.

I have found the solution here . You can checkout that tread for more information.