Search code examples
javascriptreactjscode-splittingreact-loadable

react-loadable import from multiple class exported js

How to import from a multiple class exported js file in react-loadable.
I am trying to import CustomButton from MyButton.js using react-loadable in Home.js. This is the only way I know to do it, is not working.

MyButton.js

import {
  CustomButton,
  BUTTON_STYLE,
  BUTTON_TYPE,
  BUTTON_SIZE,
  BUTTON_ALIGN,
  COLOR
} from './buttons';
module.exports = {
  CustomButton,
  BUTTON_STYLE,
  BUTTON_TYPE,
  BUTTON_SIZE,
  BUTTON_ALIGN,
  COLOR
}

Home.js

const AsyncButton = Loadable({
  loader: () => import('../../button/MyButton'),
  loading: Loading
});

Please help. Thanks in advance.

Solution

  • I was able to do it this way:

    const AsyncButton = Loadable({
  loader: () => import('../../button/MyButton').then(module => module.CustomButton),
  loading: Loading
});

    However, I can't get it where one variable contains all the other exports.