Objloader loaded but not display model in scene

Questions
1

I am in trouble,plz someone help me :).I used objloader to load obj file and wrote scene.add(obj) but not appear in my scene.
Here myCode,

import React, { Component } from "react";
import ReactDOM from "react-dom";
import * as THREE from "three";
import {OBJLoader} from "../../node_modules/three/examples/jsm/loaders/OBJLoader.js";
import {GLTFLoader} from "../../node_modules/three/examples/jsm/loaders/GLTFLoader.js";
import {MTLLoader} from "../../node_modules/three/examples/jsm/loaders/MTLLoader.js";
import {OrbitControls} from "../../node_modules/three/examples/jsm/controls/OrbitControls.js";

var camera,scene,renderer,container;

  container = document.createElement( 'div' );
	document.body.appendChild( container );

	camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.01, 10 );
	camera.position.z = 5;

  scene = new THREE.Scene();

  renderer = new THREE.WebGLRenderer();
  scene.background = new THREE.Color( 0xff0000 );
	renderer.setPixelRatio( window.devicePixelRatio );
	renderer.setSize( window.innerWidth, window.innerHeight );
	container.appendChild( renderer.domElement );

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

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

  renderer.render(scene,camera);

function onWindowResize() {

	camera.aspect = window.innerWidth / window.innerHeight;
	camera.updateProjectionMatrix();

	renderer.setSize( window.innerWidth, window.innerHeight );

}


class Main extends Component {
    componentDidMount() {
        var geometry = new THREE.BoxGeometry(1, 1, 1);
        var material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
        var cube = new THREE.Mesh(geometry, material);
        scene.add(cube);

        var ambient = new THREE.AmbientLight(0x101030);
        scene.add(ambient);

        var directionalLight = new THREE.DirectionalLight(0xffeedd);
        directionalLight.position.set(0,0,1);
        scene.add(directionalLight);

        var mtlLoader = new MTLLoader();
        mtlLoader.load('../../public/assets/Rock.mtl', function(materials) {
          materials.preload();
          for (const material of Object.values(materials.materials)) {
            material.side = THREE.DoubleSide;
          }
          var objLoader = new OBJLoader();
          objLoader.setMaterials(materials);
          objLoader.load('../../public/assets/Rock.obj', (object) =>{
            var freedomMesh = object;
            console.log( object);
               object.position.set(1,1,1); //or  this
               freedomMesh.scale.set(140, 140, 140);
            scene.add(object);
          },
            function(xhr) {
              console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
            },
            function(error) {
              console.log("An error happened" + error);
            });
          });
 
        // ayuu();

        camera.position.set(3,3,3); 
        camera.lookAt(scene.position); 
        //  camera.position.z = 5;
        var animate = function() {
            requestAnimationFrame(animate);
            cube.rotation.x += 0.01;
            cube.rotation.y += 0.01;
            renderer.render(scene, camera);
        };
        animate();
    }
    render() {
        return ( <
            div ref = { ref => (this.mount = ref) }
            />
        )
    }
}
const rootElement = document.getElementById("root");
ReactDOM.render( < Main / > , rootElement);
export default Main;
2

Maybe this example will help you LoadOBJbyModule

From the Collection of examples from discourse.threejs.org

3 
  //loaders
    const exampleObject = new THREE.Object3D();
    var mtlLoader = new MTLLoader();
    mtlLoader.load('../../public/assets/Rock.mtl', function (materials) {
      materials.preload();
      var objLoader = new OBJLoader();
      objLoader.setMaterials(materials);
      objLoader.load('../../public/assets/Rock.obj', (object) => {
        exampleObject.add(object);
      },
        function (xhr) {
          console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
        },
        function (error) {
          console.log("An error happened" + error);
        });
    });

    exampleObject.scale.set(2.5, 2.5, 2.5);

    scene.add(exampleObject);

i got Infinity% loaded but still not display in scene :expressionless: