Converted .glsl files to .glsl.js

[mrdoob]

After this change we can now import directly from source:

<script type="module">
	import * as THREE from "../src/Three.js";
</script>

Or import the classes directly:

<script type="module">
	import { WebGLRenderer } from '../src/renderers/WebGLRenderer.js';
	const renderer = new WebGLRenderer();
</script>

Example:
https://raw.githack.com/mrdoob/three.js/dev/examples/webgl2_sandbox.html

This should help for eventually clarifying dependencies and reducing bundle sizes.

Unfortunately we lose glsl syntax highlighting.

Fixes #14446

---

EDIT:

However... Even if it's now possible, it's not recommended. We can't guarantee backwards compatibility with that approach.

[WestLangley]

How do we do this now?

> scene.children
> renderer.info

[mrdoob]

That code should still work?

[donmccurdy]

ES modules have isolated scope. Their variables won't be accessible from the console unless assigned to the global scope, e.g. Object.assign(window, {scene, renderer});.

[mrdoob]

Oh! I understand the question now.

@WestLangley #5835 (comment)

[mrdoob]

Hmm... Added a note at the end of the first post.