vite加载导入glsl文件报错

vite速度快，node_modules里的文件比webpack少太多太多，而且，对很多文件，如js、css等都内置了解析方式，不像webpack需要配置很多loader和plugins。

今天，我爱模板网用vite导入.glsl文件时，却报错了：

导入代码如下：

import basicVertextShader from './shader/basic/vertex.glsl'
import basicFragmentShader from './shader/basic/fragment.glsl'

报错：

Uncaught SyntaxError: Unexpected token '{' (at vertex.glsl?import:1:13)

应该是vite尝试解析glsl文件，遇到了不理解的语法，报错了。

其实.glsl是着色器语法，并不需要去解析它，只要将它的内容作为字符串传给threejs，threejs自然会调用相关方法去解析它。

所以，在导入时，告诉vite，以字符串形式加载.glsl文件即可，即在文件后面加上“raw”参数即可：

import basicVertextShader from './shader/basic/vertex.glsl?raw'
import basicFragmentShader from './shader/basic/fragment.glsl?raw'

不得不说，vite真的太牛了！