Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support dynamic imports and arbitrary modules, not just components #44

Open
hoschi opened this issue May 9, 2017 · 1 comment
Open

Comments

@hoschi
Copy link

hoschi commented May 9, 2017

Webpack supports dynamic imports, which can have a variable in the module path.
To support this with react-async-component it must hold more than one loaded module, not just one.
This way it can prevent flash of content for each already loaded module.

Example for this is a bunch of possible icon files to load, but only know which to render at runtime.
In combination of that example and the dynamic import, another feature would be to use the loaded module not only as component.
I used another method render to do something with the loaded module.

Here is an exapmle of the icon use case:

import React from 'react';
import GeneralIcon from 'place/GeneralIcon'
import { asyncComponent } from 'react-async-component';

export let config = {
    resolve: (props) => import(`icons/${props.iconName}/iconDescription`),
    getModuleId: (props) => props.iconName,
    autoResolveES2015Default: false,
    render: (iconDescription, props) => <GeneralIcon {...props} iconDescription={ iconDescription } />,
};

export default asyncComponent(config);

This can be used to

  • apply module content to a generic component
  • bundling each file in a directory as its own bundle and decide at runtime by props which to show
  • loading one module which contain different parts of the app, like @djeeg showed here

I created a working example, you can see the changes needed here.
@ctrlplusb please tell me if this looks good to you and I should proceed with it. I don't know much about SSR, so this is better done by you, if needs additional changes.

@hoschi
Copy link
Author

hoschi commented Jun 22, 2017

@ctrlplusb do you still working on this problem? If not it would be good to know if you are ok with my approach so I can finish that, thanks.

@hoschi hoschi mentioned this issue Feb 14, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant