search

teambit / envs

Component development environments for the Bit community
https://bit.dev/bit/envs
Other
64 stars 9 forks source link

Issue with Vue bundler > 2.5.0 due to bug in Webpack 4 #83

Open ja1984 opened 4 years ago

ja1984 commented 4 years ago

Describe the bug

We have have an component build in Vue that is on Bit that we use in a Nuxt project. Everything have worked great this far, but today we decided to update Vue bundler from 0.0.4 -> 2.6.20 and that made our component break the entire Nuxt project with a "window undefined" error in the SSR.

After digging around in the js-files for our component and comparing a project that had not yarn installed the latest version of our bundled component with the one from the nuxt project I could see that the latest bundle contained a reference to window.

After googling for a bit I gound this issue on SO: https://stackoverflow.com/questions/49111086/webpack-4-universal-library-target

And that is the exact problem we are having, so it seems like there is an issue where webpack uses window instead of self/this for context.

So it's enough to just import the component without even using it to make the project crash.

Since we know that our component will be used in a SSR environment we are VERY careful not to use window in anything that could be loaded server side.

Steps to Reproduce

  1. Upload an vue component to bit, using bundler 2.5.1 or newer (I had my issue with 2.6.20)
  2. Load that component in a Nuxt project and import the library in any component
  3. 🧭💥

Expected Behavior

The component should be able to be imported in our Nuxt project.