Install fancyapps Fancybox, module parse failed 'unexpected token'

Hi all,

I did import Fancyapps (Fanxybox) through yarn yarn add @fancyapps/ui
This all did work so I then started implementing the scripts in resources\assets\scripts\main.js

I added following lines to the file:

import { Fancybox } from "@fancyapps/ui/src/Fancybox/Fancybox";
Fancybox.bind('[data-fancybox]', { // Your options go here });

After that i ran yarn build and it threw following error:

` error in ./node_modules/@fancyapps/ui/src/Panzoom/Panzoom.js

Module parse failed: Unexpected token (489:29)
You may need an appropriate loader to handle this file type.
| }
| this._dragOffset = { …this.dragOffset };
| if (pointerTracker.currentPointers.length) {`

It looks like the spread syntax (…) is not working.
Does anyone know how to fix this? I can’t find an answer to fix this.

Thanks already!

Hey there! What version of Sage is this on?


We are currently using Sage 9.0.10

Is this related (also Sage 9.x):

I did exclude the lines, now I am getting following error:

in ./node_modules/@fancyapps/ui/src/Fancybox/Fancybox.js

`Module build failed:
161 : /**
162 : * Bind event handlers for referencability
163 : */
164 : bindHandlers() {
165 : for (const methodName of [
for…of statements are not supported. Use ‘transforms: { forOf: false }’ to skip transformation and disable this error, or ‘transforms: { dangerousForOf: true }’ if you know what you’re doing (165:4)

@ ./resources/assets/scripts/main.js 12:0-66
@ multi ./resources/assets/build/util/…/helpers/hmr-client.js ./scripts/main.js ./styles/main.scss`

Does anyone know how to fix this error?
Thanks! :slight_smile: