Scrollmagic: Import debug.addIndicators

[movie4]

Hello, thanks for great app, i try use ScrollMagic with: ES6 import and webpack + babel

import ScrollMagic from './vendor/ScrollMagic'
require('./vendor/debug.addIndicators')

after building bundle get follow error

debug.addIndicators.js:27 Uncaught ReferenceError: require is not defined

Thanks

[keslo]

Так к вас require не определён.

[movie4]

here code from debug.addIndicators.js

(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD. Register as an anonymous module.
        define(['ScrollMagic'], factory);
    } else if (typeof exports === 'object') {
        // CommonJS
        factory(require('scrollmagic'));
    } else {
        // no browser global export needed, just execute
        factory(root.ScrollMagic || (root.jQuery && root.jQuery.ScrollMagic));
    }
}(this, function (ScrollMagic) { ... }))

typeof exports = object
typeof require = undefined

[CaptainN]

This worked with JSPM - should be similar with webpack?

import ScrollMagic from 'scrollmagic'
import 'scrollmagic/scrollmagic/uncompressed/plugins/debug.addIndicators'

[joegasewicz]

Thanks @CaptainN been looking for this for ages!

[juanvs23]

the best solution is this:
1.Config webpack.config.js

resolve: {
alias: {
"TweenLite": path.resolve('node_modules', 'gsap/src/uncompressed/TweenLite.js'),
"TweenMax": path.resolve('node_modules', 'gsap/src/uncompressed/TweenMax.js'),
"TimelineLite": path.resolve('node_modules', 'gsap/src/uncompressed/TimelineLite.js'),
"TimelineMax": path.resolve('node_modules', 'gsap/src/uncompressed/TimelineMax.js'),
"ScrollMagic": path.resolve('node_modules', 'scrollmagic/scrollmagic/uncompressed/ScrollMagic.js'),
"animation.gsap": path.resolve('node_modules', 'scrollmagic/scrollmagic/uncompressed/plugins/animation.gsap.js'),
"debug.addIndicators": path.resolve('node_modules', 'scrollmagic/scrollmagic/uncompressed/plugins/debug.addIndicators.js')
},
},

then import

import ScrollMagic from "scrollmagic/scrollmagic/minified/ScrollMagic.min";
import "scrollmagic/scrollmagic/minified/plugins/animation.gsap.min";
import "scrollmagic/scrollmagic/minified/plugins/debug.addIndicators.min";
import TweenMax from "gsap/src/minified/TweenMax.min";
import TimelineMax from "gsap/src/minified/TimelineMax.min";

souge:https://github.com/janpaepke/ScrollMagic/wiki/Getting-Started-:-Using-AMD