'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. |
