Three.js Loaders

I got the package file, 'three.js-dev' from threejs.org.

All loaders examples shown well.

I coded it to embody 'json loader' referred from 'examples' folder.

This is my 'main.html' codes to embody 'json loader', which places at 'three.js-dev' folder.

<script type="text/javascript" src="./build/three.js"></script>

<script type="text/javascript" src="./src/loaders/JSONLoader.js"></script>

<script src="./examples/js/controls/TrackballControls.js"></script>
<script src="./examples/js/Detector.js"></script>


<!-- _ BASE STYLE -->
<style>
    body {
        /* set margin to 0 and overflow to hidden, to go fullscreen */
        margin: 0;
        overflow: hidden;
    }
</style>

Upper code shows js source locations.

// World Variable
//////
//  //
//////

// DOCUMENT VARIABLE
var SCREEN_WIDTH = window.innerWidth;
var SCREEN_HEIGHT = window.innerHeight;
var windowHalfX = window.innerWidth / 2;
var windowHalfY = window.innerHeight / 2;

var mouseX = 0, mouseY = 0;

var container;

// THREE VARIABLE
var camera;
var scene;
var renderer;

var model;



// Initiate
//////
//  //
//////

init();
animate();



// init function
//////
//  //
/////////
////// //
/////////
function init() {



    container = document.getElementById( 'WebGL-output' );

    camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 100000 );
    camera.position.z = 500;

    scene = new THREE.Scene();


    // LIGHTS

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



    // LOADER
    //////
    //  //
    //////
    // var loader = new THREE.JSONLoader();

    // loader.load( './models/teapot-claraio.json', museumCallback );


    // BEGIN Clara.io JSON loader code
    var objectLoader = new THREE.ObjectLoader();
    objectLoader.load("models/teapot-claraio.json", function ( obj ) {
        scene.add( obj );
    } );
    // END Clara.io JSON loader code



    // RENDERER
    //////
    //  //
    //////
    renderer = new THREE.WebGLRenderer();
    renderer.setClearColor( 0xffffff );
    renderer.setPixelRatio( window.devicePixelRatio );
    renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
    renderer.domElement.style.position = "relative";

    container.appendChild( renderer.domElement );







    // MOUSE MOVE
    document.addEventListener( 'mousemove', onDocumentMouseMove, false );

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

}



function museumCallback( geometry,  materials ){
    var material = new THREE.MeshFaceMaterial( materials );
    model = new THREE.Mesh( geometry, material );
    model.scale.set (1,1,1);
    model.position.set (0,0,0);
    scene.add( model );            
}

function onWindowResize() {

    windowHalfX = window.innerWidth / 2;
    windowHalfY = window.innerHeight / 2;

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

    renderer.setSize( window.innerWidth, window.innerHeight );
    // if ( canvasRenderer ) canvasRenderer.setSize( window.innerWidth, window.innerHeight );

}

function onDocumentMouseMove(event) {

    mouseX = ( event.clientX - windowHalfX );
    mouseY = ( event.clientY - windowHalfY );

}

function animate() {

    requestAnimationFrame( animate );
    render();

}

function render() {

    camera.position.x += ( mouseX - camera.position.x ) * .05;
    camera.position.y += ( - mouseY - camera.position.y ) * .05;

    camera.lookAt( scene.position );

    renderer.render( scene, camera );

}

`

And browser resulted the error at console tab.

JSONLoader.js:1 Uncaught SyntaxError: Unexpected token import

other error at source tab.

Uncaught SyntaxError: Unexpected token import

I thought, is there issues about 'javascript import'?

So I searched it, and found this. https!!://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/import

and I replaced './Loader' by "./Loader".

But the error remains.

Is anyone who have wonder wisdom about this issue? Help!