'Webpack chunk size and named exports

I'm building my project and i have an index which exports some components, but one of them (Navbar) is increasing my main chunk size. I do not import it anywhere, but if i do not export it from index, the chunk size decreases. Is this expected or there's something wrong with the code? The project uses create-react-app, so treeshaking should be ok.

ps: The said component imports another component from a library, so the chunk size increases a lot. Its not a problem when i actually use it, but in this case it shouldn't do this.

export { default as StepWrapper } from './StepWrapper';
export { default as MainPageContainer } from './MainPageContainer';
export { default as AnimatedRouteContainer } from './AnimatedRouteContainer';
export { default as StepForm } from './StepForm';
export { default as PageTitle } from './PageTitle';

/*This increases chunk size, despite not being imported anywhere*/
export { default as Navbar } from './Navbar'; 


Solution 1:[1]

Had the same problem. I solved it by placing this in the package.json file:

{
 "name": "component's name",
 "sideEffects": [
  "./src/path-to-file/index.js"
 ],
 ...
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Rafael J. Mateo C.