Using DragControls and Getting Error "DragControls is not defined"

Questions
1

I’m new to using Threejs and am trying to use DragControls on a Rubiks Cube simulation. I’m getting an error reading “DragControls is not defined.”

Here’s my code:

"use strict";

// THREEJS BOILERPLATE

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 3, window.innerWidth / window.innerHeight, 0.1, 1000 );

const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

// functions that create and initialize my cube //

// fix camera position so we can see cube
camera.position.z = 5;

///////////////////////////////////////////////////////////////

// LIGHTS
var ambientLight = new THREE.AmbientLight(0xffffff, 0.2);
scene.add(ambientLight);

var light = new THREE.PointLight(0xffffff, 0.8, 18);
light.position.set(-3,6,-3);
light.castShadow = true;
// Will not light anything closer than 0.1 units or further than 25 units
light.shadow.camera.near = 0.1;
light.shadow.camera.far = 25;
scene.add(light);

///////////////////////////////////////////////////////////////

// CONTROLS
const controls = new THREE.OrbitControls( camera, renderer.domElement );

//controls.update() must be called after any manual changes to the camera's transform
camera.position.set( 100, 100, 100 );
controls.update();

const controls2 = new DragControls(cubes, camera, renderer.domElement)

///////////////////////////////////////////////////////////////

/**
 * Rendering scene - make the cube visible to us.
 */
function animate() {
	requestAnimationFrame( animate );

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

My index.html file is:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Rubiks Cube</title>
    <style>
        body {
            margin: 0;
        }
    </style>
</head>

<body>
    <!-- Base -->
    <script src="three.js"></script>
    <!-- Edges  -->
    <!-- <script src="//cdn.rawgit.com/mrdoob/three.js/master/src/geometries/EdgesGeometry.js"></script> -->
    <!-- Controls -->
    <script src="//cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/OrbitControls.js"></script>
    <script src="//cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/DragControls.js"></script>
    <!-- Custom -->
    <script src="rubik.js"></script>
</body>

</html>