Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support treeshaking via sideEffects in package.json #1331

Closed
mattcosta7 opened this issue Jul 15, 2021 · 0 comments · Fixed by #1332
Closed

Support treeshaking via sideEffects in package.json #1331

mattcosta7 opened this issue Jul 15, 2021 · 0 comments · Fixed by #1332

Comments

@mattcosta7
Copy link
Collaborator

Describe the bug

When consuming a single @primer/components component, the entire set of components is included in the build (even when using lib-esm), since the package.json does not declare the package as free of sideEffects via sideEffects: false or sideEffects: ['file 1', 'file 2']

Deep importing like

import {Button} from '@primer/components/lib-esm/components/Button' seems to work properly, however if any import to import {} from '@primer/components' is made, then eveything exported from @primer/components is included in the build

To Reproduce
Steps to reproduce the behavior:

  1. Open a new project
  2. Add @primer/components as a dependency
  3. Import a single component like import {Button} from '@primer/components'
  4. Generate and analyze a bundle, note that all components are included in bundle

Expected behavior

Only the used components are included in the build

Screenshots

My project, bundled with webpack 4 emits a bundle containing this:

Screen Shot 2021-07-15 at 10 43 21 AM

Which includes components like etc which are not used in my project.

Updating the node_modules package.json for @primer/components to include sideEffects: false and rebuilding with the same command leads to a bundle containg this

Screen Shot 2021-07-15 at 10 34 54 AM

Which removes unused components from my project, leading to a large reduction in bundle size

Desktop (please complete the following information):

  • N/A

Smartphone (please complete the following information):

  • N/A
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant