search

vuejs / vue-jest

Jest Vue transformer
MIT License
744 stars 157 forks source link

Upgraded vue-jest to vue2-jest for Jest 27+ and got a 10KB bundle increase #436

Open gkatsanos opened 2 years ago

gkatsanos commented 2 years ago

We updated Jest to 27.x.x and switched to vue2-jest. We noticed our bundle increased quite a bit (10KB on zipped/minified) because a list of dependencies seems to be added to our bundle because of vue2-jest.

"@babel/code-frame@^7.16.7"
"@babel/generator@^7.16.7"
"@babel/helper-environment-visitor@^7.16.7"
"@babel/helper-function-name@^7.16.7"
"@babel/helper-get-function-arity@^7.16.7"
"@babel/helper-hoist-variables@^7.16.7"
"@babel/helper-module-imports@^7.16.7"
"@babel/helper-module-transforms@^7.16.7"
"@babel/helper-plugin-utils@^7.16.7"
"@babel/helper-simple-access@^7.16.7"
"@babel/helper-split-export-declaration@^7.16.7"
"@babel/helper-validator-identifier@^7.16.7"
"@babel/highlight@^7.16.7"
"@babel/parser@^7.16.7"
"@babel/plugin-transform-modules-commonjs@^7.2.0"
"@babel/traverse@^7.16.7"

... and more.

all these end up in our production bundle.

is the above accurate, or are we doing something wrong? Naturally, @vue/vue2-jest is in devDependencies.

LinusBorg commented 2 years ago

I don't see any way those dependencies could end up in your production bundle unless you (or something in your build process) imports them. - and vue-jest is not part of that build process, presumably - being a testing library only.

I don't think we can say much here with zero knowledge of your project's build setup.

gkatsanos commented 2 years ago

Hi Linus! A pleasure as always. Sorry for being vague. Please ignore the diff above. Here are the facts I'm 100% sure about.

BTW "@babel/core": "^7.16.5" was already in the package. (no diff there)

and set the transform option of vue files to be '@vue/vue2-jest'. Our bundle diff size is about 20KB (compressed/gziped) more after these changes... Would this be expected? (I dont want to paste our entire lock file as I guess it would be too long to go through). We run webpack analyzer and compare the bundles.

LinusBorg commented 2 years ago

Would this be expected?

No, as I said, how could it? Unless you build setup kind of wildcard-includes any babel-tranform it finds on disc (which would, in my book, be a bad idea) and ends up with transforms that increase the size of the transformed code.

Nothing that this library installs magically injects itself into your webpack setup.

gkatsanos commented 2 years ago

Since vue2-jest is bundled from yarn , I guess it does end up being a part of my bundle, right? (not a production install) I don't know how, but if I could speculate I'd say the vue2-jest package has more dependencies? I tried to analyze it in https://bundlephobia.com/package/@vue/vue2-jest but it fails for some reason to analyze the package.

LinusBorg commented 2 years ago

I assume you don't import vue2-jest into your app's code - you only import it in tests. So how should it's size have any impacton your app's bundle size?

gkatsanos commented 2 years ago

Would the fact that I'm using nuxtjs and its a server/client bundle have anything to do with it?

LinusBorg commented 2 years ago

I don't see how