Я новичок в разделении кода с помощью React и Webpack, поэтому я не уверен, что это нормальный размер для фрагмента пакета.
Я попытался разделить свое приложение React на основе маршрутов ( в основном сделал то же самое, что и в примере в React doc ).
Это прекрасно работает, но основной пакет, который содержит индекс моего приложения (то есть рендеринг моего приложения в DOM)кажется довольно большим (~ 400Ko), и я действительно не знаю, что можно удалить, все включенное кажется необходимым (мое приложение использует компоненты apollo, реагировать, прижатие, styled-компоненты).
Вот index.jsпоэтому вы можете взглянуть на зависимости:
import React from 'react';
import ReactDOM from 'react-dom';
import ApolloClient from 'apollo-boost';
import { ApolloProvider } from 'react-apollo';
import { BrowserRouter } from 'react-router-dom';
import { Provider as StoreProvider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
import { store, persistor } from 'STORE/index';
import App from './App';
const apolloClient = new ApolloClient({
uri: 'http://localhost:3000/graphql'
});
const render = (App) => {
ReactDOM.render(
<ApolloProvider client={apolloClient}>
<StoreProvider store={store}>
<PersistGate loading={null} persistor={persistor}>
<BrowserRouter>
<App />
</BrowserRouter>
</PersistGate>
</StoreProvider>
</ApolloProvider>,
document.getElementById('root')
);
};
render(App);
if (module.hot) {
module.hot.accept('./App', () => {
render(require('./App'));
console.log('App updated successfully.');
});
}
Опять же, я новичок в разделении кода, так что, возможно, это нормальный размер, но веб-пакет постоянно говорит мне, что размер пакета слишком велик.
Еще раз спасибо!
РЕДАКТИРОВАТЬ: Вот посмотрите на анализатор пакетов моего приложения, если это поможет .