Почему на работает анимация GSAP в React-компоненте?

Question

[Андрей]

import TweenLite from 'gsap/umd/TweenLite';

class Background extends React.Component {
    constructor(props) {
        super(props);
        this.frame = React.createRef();
    }

    componentDidMount() {
        TweenLite.set(this.frame.current, { width: 0, height: 0, opacity: 0 });
        TweenLite.to(this.frame.current, 10, { width: '50%', height: '60%', opacity: 1 });
    }

    render() {
        const { children } = this.props;

        return (
            <div className="background" ref={this.frame}>
                <div className="background__content">
                    {children}
                </div>
            </div>
        );
    }
}

При этом стили прописываются прямо к HTML-элементу, а не в объект style:
https://yadi.sk/i/DQGdMATtlBqQ5g

Answer 1

[kulaeff]

Нужно подключить еще также и CSSPlugin. Либо вместо TweenLite использовать TweenMax, который уже его включает.