Skip to content
This repository has been archived by the owner on Sep 29, 2020. It is now read-only.

Tree shaking seems not working. #140

Open
SidKwok opened this issue Sep 28, 2017 · 5 comments
Open

Tree shaking seems not working. #140

SidKwok opened this issue Sep 28, 2017 · 5 comments

Comments

@SidKwok
Copy link

SidKwok commented Sep 28, 2017

I use core-decorators in create-react-app project, and use function in this way:

import {autobind} from 'core-decorators';

But the bundle size doesn't reduce.

When I change in this way:

import autobind from 'core-decorators/lib/autobind;'

The bundle size seems good to me.

Did I misunderstanding tree-shaking?

Let me know if you need more infomation.

@SidKwok
Copy link
Author

SidKwok commented Sep 28, 2017

And rollup works fine.

config:

import resolve from 'rollup-plugin-node-resolve';

export default {
    input: 'index.js',
    output: {
        file: 'test.js',
        format: 'umd',
        name: 'yo',
    },
    plugins: [
        resolve({
            jsnext: true,
            main: true,
            browser: true
        })
    ]
}

index.js:

import {autobind} from 'core-decorators'

export default autobind

@jayphelps
Copy link
Owner

jayphelps commented Sep 28, 2017

hmm if it works in rollup, but not webpack2, that seems to suggest webpack2 is the culprit--though something I'm doing might be making it less than ideal to webpack2's logic 😄 . If you have time to make an example repo I can use to reproduce I'll take a closer look?

This might be the issue: facebook/create-react-app#2748 and webpack/webpack#2867

@SidKwok
Copy link
Author

SidKwok commented Sep 29, 2017

Yeah, it is really easy to reproduce. Run all these lines:

create-react-app react-demo
cd react-demo
npm install core-decorators --save

App.js:

...
import {autobind} from 'core-decorators';
...

Then run npm run build, see the bundle size:
c4f6124e37794f97ceb54db0eb0e599f

Edit App.js:

...
import autobind from 'core-decorators/lib/autobind';
...

Then run npm run build, see the bundle size:
90ab5b3a3d950778e05c5575b6cff4a8

I solve this issue by using babel-plugin-transform-imports.

@benneq
Copy link

benneq commented Jul 30, 2018

Any news on this?

@jraoult
Copy link

jraoult commented Jan 11, 2019

@jayphelps @benneq I just did some testing by forcing sideEffects to false in the webpack config and I could confirm the positive effect on the final bundle size. That said, it would be better to set that in the package.json directly as described here: https://github.com/webpack/webpack/tree/master/examples/side-effects.

FYI that's the rule I use in my webpack config as a workaround:

{
  test: /node_modules\/core-decorators/,
  sideEffects: false
}

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants