Unexpected token in production build

[garstikaitis]

Hey,

After I have installed this component to the project, I cannot run my webpack production build.

The error I get

from UglifyJs
Unexpected token: operator (>)

I checked the minified version of vue-fragments, and seems like compiler does not understand arrow functions, since it breaks in there. Any idea how to fix that?

I use arrow functions through out my project, so my webpack config should be okay.

Cheers 👍

[y-nk]

the compiler does not support arrow functions ? you mean like () => {} ?

[garstikaitis]

Yep, it fails on =>

[jonaskuske]

Yep, the normal uglifyJS can't handle ES6.

@garstikaitis You're webpack config is probably set up so only your own code gets transpiled – which is why arrow function work for you, but not as part of this package.
Check your config for babel-loader, you probably either exclude node_modules or only include your src/ directory here. That's a pretty common setup because usually everything you get on npm is already transpiled, so you don't have to use Babel again there.
But since vue-fragments ships with ES6 code, you'll have to configure babel-loader to transpile it. :)

[adi518]

This is because Rollup config for this package doesn't transpile to ES5. It's easy to fix though. Meanwhile, you can include this package in your babel-loader config so it gets transpiled with the rest of your code.

[Magistross]

Using Vue CLI 3, added 'vue-fragments' to the 'transpileDependencies' config and I got the following line when I compile export 'Plugin' (imported as 'fragment') was not found in 'vue-fragments' Obviously nothing works afterwards, what might have I done wrong ?

[y-nk]

I'm gonna add a transpile to es5 step in the build so this could be solved.