Attempted import error: 'update' is not exported from '@createjs/tweenjs' (imported as 'TWEEN')

I am trying to create an infinite loop for the animation using tween.js but it gives me this error related to TWEEN.update(time), I also tried TWEEN.default.update() but i get this Attempted import error: '@createjs/tweenjs' does not contain a default export (imported as 'TWEEN'). If I remove TWEEN.update(time) the animation works but stops after one revolution. How do I make it work? is there another library that needs to be imported?

here is the concerned code:

import React, {Component} from 'react';
import * as THREE from "three";
import './App.css';
import './style.css'
import {OrbitControls} from "three/examples/jsm/controls/OrbitControls";
import * as TWEEN from '@createjs/tweenjs' 



class App extends Component{

  componentDidMount() {
    var scene, camera, renderer;
    var controls;

    init();
    animate();

    function createPlanet(radius, distance, tilt, color, speed) {
      var orbitContainer = new THREE.Object3D();
        //orbitContainer.rotation.x = tilt;

        var orbit = new THREE.Object3D();

        var geometry = new THREE.CircleGeometry(distance, 100);
        geometry.vertices.shift();
        var line = new THREE.Line(
          geometry,
           new THREE.LineBasicMaterial({color: 'aqua'})
        );

        //ring movement
        line.rotation.x = Math.PI * 0.5;

        var planet = new THREE.Mesh(
          new THREE.SphereGeometry(radius, 32, 32),
            new THREE.MeshPhongMaterial({color: color})
        );
        // initial position
        // distance away from the center

        planet.position.set(distance, 0.0, 0.0);

        //orbit.add(line);
        orbit.add(planet);

        new TWEEN.Tween(orbit.rotation).to({y:  //'+' or '-' for rotation direction
        '+' + (Math.PI * 2)}, 4000 / speed);




        orbitContainer.add(orbit);
        scene.add(orbitContainer);

        return orbitContainer;
    }

    function init() {

        scene = new THREE.Scene();
        scene.background = new THREE.Color(0x202020);

        camera = new THREE.PerspectiveCamera(60, 4 / 3, 0.1, 10000.0);
        camera.position.set(20.0, 20.0, 20.0);
        camera.lookAt(new THREE.Vector3(0, 0, 0));

        renderer = new THREE.WebGLRenderer({antialias: false});

        controls = new OrbitControls(camera, renderer.domElement);

        var ambientLight = new THREE.AmbientLight(0xffffff, 0.1);
        scene.add(ambientLight);

//light emission will be the icon with a line connecting to the logo (sun) and will light up the line and icon when selected 

        var solar = new THREE.Mesh(
            new THREE.SphereGeometry(1.0, 32, 32),
            new THREE.MeshPhongMaterial({emissive: 0xff5800, emissiveIntensity: 0.5})
        );
        var pointLight = new THREE.PointLight(0xffffff, 1.0, 300.0);
        solar.add(pointLight);
        scene.add(solar);

        createPlanet(0.5, 3.2, 0.25, 'yellow', 1.0);
        createPlanet(0.6, 7.0, 0.1, 'red', 2.0);
        createPlanet(1.0, 11.0, 0.0, 'blue', 0.4);
        createPlanet(0.7, 14.2, 0.25, 'green', 0.9);
        createPlanet(0.4, 20.0, 0.0, 0, 'pink', 3.0);

        window.addEventListener('resize', onWindowResize, false);
        onWindowResize();

        document.body.appendChild(renderer.domElement);
    }

    function onWindowResize() {
        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();
        renderer.setSize(window.innerWidth, window.innerHeight);
    }

    function animate(time) {
   TWEEN.update(time);

        controls.update();

        renderer.render(scene, camera);
        requestAnimationFrame(animate);
    }



  }
render(){

  return (

<div>




</div>



)}}

export default App;

Looks like you're confusing your animation modules (the naming convention can be very confusing with so many similar names). You installed @createjs/tweenjs, but you're following the documentation for something else. If you install @createjs/tweenjs, you should follow the documentation for that specific module. You'll find its docs don't suggest that you import in the method you're using: import * as TWEEN from '@createjs/tweenjs', nor does it require TWEEN.update(time); on each frame.

However, @tweenjs/tween.js, does suggest in its user guide that you use it as follows:

const TWEEN = require('@tweenjs/tween.js');
// Can probably be substituted with: 
import * as TWEEN from '@tweenjs/tweenjs' 


TWEEN.update(currentTime)