Just for explain the alias needed. For use GSAP and ScrollMagic together, there is a malfunction with WebPack that I don’t understand completely:
Here is an explanation and a fix (don’t work for me):
https://stackoverflow.com/a/35531127/2986401
Another fix implies the use of aliases (it works for me):
https://github.com/janpaepke/ScrollMagic/issues/665#issuecomment-299663544
And somebody mention it even in this forum:
https://discourse.roots.io/t/sage-9-external-dependencies-gsap-scroll-magic/10002/2?u=aitor
If I remove GSAP aliases I get this error at yarn build:
These dependencies were not found:
* TimelineMax in ./node_modules/scrollmagic/scrollmagic/uncompressed/plugins/animation.gsap.js
* TweenLite in ./node_modules/gsap/src/minified/TimelineMax.min.js, ./node_modules/gsap/src/minified/plugins/ScrollToPlugin.min.js
* TweenMax in ./node_modules/scrollmagic/scrollmagic/uncompressed/plugins/animation.gsap.js
If I remove ScrollMagic aliases I get another error:
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* /Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/ScrollMagic/scrollmagic/uncompressed/ScrollMagic.js
Used by 2 module(s), i. e.
/Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/scrollmagic/scrollmagic/uncompressed/plugins/animation.gsap.js
* /Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/scrollmagic/scrollmagic/uncompressed/ScrollMagic.js
Used by 1 module(s), i. e.
/Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/cache-loader/dist/cjs.js!/Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/buble-loader/index.js??ref--2-1!/Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/eslint-loader/index.js!/Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/node_modules/import-glob/index.js!/Volumes/B/Documentos/trellis3/quercusoficinasydespachos/web/app/themes/qod/resources/assets/scripts/routes/home.js
Of course, it is only for ScrollMagic, not GSAP, the topic of this thread. Just to give my final solution, this is that work for me. Any suggestions will be appreciated:
Working deployed site: https://stage.quercusoficinasydespachos.com/