Как собрать js модулями (webpack)?

Question

[d-virt]

Здравствуйте.

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import App from './containers/app';

ReactDOM.render(
    <App/>,
    document.getElementById('app')
);

При вызове команды webpack, все отлично компилится в 1 файл build.js, запускается в браузере и работает.
Но вот хочет что бы было примерно вот так:

import React from 'react';
import ReactDOM from 'react-dom';

const App = requery('app');

ReactDOM.render(
    <App/>,
    document.getElementById('app')
);

А так же при компиляции получить два файла build.js, app.js и при загрузке в браузер build.js, автоматом подтягивался app.js

Пожалуйста, подскажите, как это можно реализовать?

Спасибо!

Answer 1

[Lynn «Кофеман»]

https://webpack.github.io/docs/code-splitting.html

Прямо такой код работать не будет, потому что автоматическая загрузка дополнительного файла это асинхронное действие.

Comments

[d-virt]

Понятное дело, что ReactDOM.render должен вызываться в app.js, что бы работал код. Я Вот сейчас смотрю в сторону CommonsChunkPlugin, только не пойму, как в коде мне указать requery

[d-virt]

d-virt, https://webpack.js.org/guides/code-splitting/#dyna...

Используйте библиотеку: https://www.npmjs.com/package/react-loadable
Там же и примеры, как реализовывать import