Я делаю app.client.js и app.server.js, плюс делаю код и создаю vendor.chunk.js 1.chunk.js (это должен быть мой комплект компонентов, который загружается по запросу).
Когда я смотрю на них, они все разные, но когда я смотрю на них через DevTools, каждый пакет похож на экран ниже:

Это часть моего renderer.js, которую я использую для выполнения res.send (~ html ~):
export default (req, res, next) => {
let context = {};
let modules = [];
const html = ReactDomServer.renderToString(
<Capture report={moduleName => modules.push(moduleName)}>
<Router context={context} location={req.url}>
<App/>
</Router>
</Capture>
);
let bundles = getBundles(stats, modules);
return res.send(`
<!doctype html>
<html lang="en">
<head>...</head>
<body>
<div id="app">${html}</div>
<script src="../../../dist/vendor.chunk.js"></script>
${bundles.map(bundle => {
return `<script src="${bundle.publicPath}"></script>`
}).join('\\n')}
<script src="../../../dist/app.client.js"></script>
</body>
</html>
`);
}
Можете ли вы объяснить мне, почему он сломан?
Спасибо!
UPD :
после установки моего файла server / index.js следующим образом ...
const app = Express();
const Router = Express.Router();
Router.use(Express.static(
'dist',
{ maxAge: '30d' }));
Router.use('*', serverRenderer);
app.use(Router);
preloadAll().then(() => {
app.listen(PORT, (error) => {
if (error) return console.log('ERROR', error.message);
console.log('Server listening on ', PORT);
});
});
... У меня есть другая проблема: 1.chunk.js и 1.chunk.js.map каким-то образом дублируются, и devtools предупреждает меня с ошибкой «Неожиданный токен:». Вот как это выглядит сейчас:
