блин, нет ) только не это...
вопрос был, используется ли вебпак или что-то подобное... если import используется в <script module...> подразумевает что надо импортировать js файлы, а не текст или еще что-то... насколько я понял three.js хавает glsl в виде текста, по этому нужен raw-loader ))... пока гуглил ошибку из первого сообщения, я нагуглил так же несколько лоадеров конкретно для glsl... но это сути не меняет )...

итого, неизвестные: есть вебпак? а какой сервер? ... )

Без вебпака, сервер Apache

тогда нужен https://webpack.js.org/, там на главной странице то, что поможет )... даже мудрить не надо особо, просто лоадер добавить...

если совсем будет туго с пониманием, можно этот туториал пройти
https://webpack.js.org/guides/getting-started/

Ты ошибаешься.

Three.js с помощью ключевого слова import загружает и подключает модуль который является самым обычным JavaScript как и положено делать директиве import.
А уже этот модуль на JavaScript возвращает строку (текст шейдера)
Как пример шейдер по умолчанию.

Код подключающий модули с шейдерными программами
https://github.com/mrdoob/three.js/b...derMaterial.js

Код в котором написан модуль с шейдерной программой
https://github.com/mrdoob/three.js/b...vertex.glsl.js

Если я правильно понял то ты пытаешься подключить шейдерные программы не организуя их как модуль JavaScript что приводит к ошибкам.

Не совсем так, берем какой-то шейдер, например, https://github.com/mrdoob/three.js/b...h_vert.glsl.js
и видим там:

export default /* glsl */``

идем в package.json

там видим
"build": "rollup -c utils/build/rollup.config.js",

идем в https://github.com/mrdoob/three.js/b...llup.config.js

и на 204 строке видим ) как rollup парсит ast на предмет /* glsl */

-
Вывод: это не простой js файл...

----
p.s. хотя нет ) это простой js файл...