Troubleshooting

White page (while using Create React App)

It is supposed that Create React App will generate one main bundle only. You should replace bundle.js with [name].js to separate main app and Uibook:

filename: isEnvProduction
  ? 'static/js/[name].[contenthash:8].js'
  : isEnvDevelopment && 'static/js/bundle.js',
                                   ^^^^^^

Replace with:

  : isEnvDevelopment && 'static/js/[name].js',

webpack.config.js

Any ideas how to improve this? Please PR.

No Pages

You should describe each test component. Please read about configuring.

No Cases

You forget to pass Cases to your Page. Read more about Cases here.

Iframe Error

Uibook renders Responsive Cases in a <iframe>. There few possible reasons of Iframe error:

1. The Component fails to render. We recommend using Chrome to debug, because Firefox doesn’t show warnings and errors for iframes in console;
2. Custom props don’t fit URL. Uibook uses URL to pass props to iframe and your props might be too long. Also, we recommend to use strings only;
3. Component expects integers but receives string. Props passed via URL are stringified, and we’re going to fix this issue later.

Exclude Chunk Warning

If you’re using HtmlWebpackPlugin, it’s necessary to exclude uibook:

webpack.config.js

new HtmlWebpackPlugin({
  excludeChunks: ['uibook']
})

Hot Reload Warning

Uibook supports the hot reload feature. It requires webpack-dev-server. If you’re getting this error, please check that you’re using webpack-dev-server at least 3.0.0. If nothing helps, please create an issue.

HMR doesn’t work

If you wish to enable HMR in Uibook, please add hot: true both to devServer and UibookPlugin in your webpack configuration file.

---

← Back to the Controller

Next: Examples →