try THREEx in jsfiddle

dont know how to load .js

by jmcjc5u

HTML

<div id="info">Noise 3D Texture</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/84/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js">


</script>
<script src='http://jyunming-chen.github.io/tutsplus/js/threex.noiseshadermaterial-3.js'></script>

CSS

#info {
    position: absolute;
    top: 0px;
    width: 100%;
    padding: 10px;
    text-align: center;
    color: #ffff00
}
body {
    overflow: hidden;
}

JavaScript

var renderer, scene, camera, controls, mesh;
var clock;

init();
animate();

function init() {
	clock = new THREE.Clock();
	
	renderer	= new THREE.WebGLRenderer();
	renderer.setSize( window.innerWidth, window.innerHeight );
	document.body.appendChild( renderer.domElement );

	scene	= new THREE.Scene();
	camera	= new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.01, 100 );
	camera.position.z = 3;
 
	controls = new THREE.OrbitControls(camera, renderer.domElement);
 
	//////////////////////////////////////////////////////////////////////////////////
	//		add an object and make it move					//
	//////////////////////////////////////////////////////////////////////////////////	
	//var geometry	= new THREE.SphereGeometry( 0.5, 32, 32);
	//var geometry	= new THREE.PlaneGeometry(1,1);
	var geometry = new THREE.TorusKnotGeometry(1.0, 0.3, 100, 32);
	
	var material	= new THREEx.NoiseShaderMaterial()
	material.side = THREE.DoubleSide;
	mesh	= new THREE.Mesh( geometry, material );
	geometry.computeBoundingSphere();
	mesh.material.uniforms[ "scale" ].value	= geometry.boundingSphere.radius;

	scene.add( mesh );
}

function animate() {
	var delta = clock.getDelta();
	
	requestAnimationFrame (animate);
	controls.update();
	renderer.render( scene, camera );		
}