glsl插件安装后.frag文件仍显示为plain text,说明sublime未绑定后缀:需手动右下角选“glsl”语法(非旧名),并为.fs/.vs等单独绑定;vuv等three.js变量不补全是正常设计,因属运行时注入而非glsl标准;行高亮失效源于主题缺linehighlight规则;外置着色器不刷新主因是浏览器缓存或three.fileloader缓存,需加时间戳或清缓存。

GLSL插件装完.frag还是白的?先确认语法绑定是否完成
不是插件没起作用,是Sublime压根没把.frag或.vert当GLSL文件处理。插件只提供高亮能力,不自动绑定后缀。
- 打开一个
.frag文件,右下角显示Plain Text就说明完全没生效 - 点击右下角语言名 →
Open all with current extension as…→ 选带GLSL字样的项(注意不是OpenGL Shading Language这类旧名) - 如果菜单里没有
GLSL选项:按Ctrl+Shift+P输入Package Control: List Packages,搜GLSL确认是否真已安装 -
.fs、.vs、.geom等扩展名也要单独绑定,不能只绑.frag - 已打开的旧文件需手动点右下角重新选一次语法;新建同后缀文件才会自动匹配
Three.js变量如vUv、cameraPosition不补全?这不是bug,是设计如此
vUv、vNormal、cameraPosition这些根本不在GLSL标准里,是Three.js运行时注入的uniform/varying,任何标准GLSL插件都不会识别它们。
- 插件只认
gl_Position、gl_FragColor等OpenGL内建变量和vec2/mat4等类型关键字 - 想快速输入
vUv,可建vUv.sublime-snippet放在Packages/User/目录下,内容含<tabtrigger>vuv</tabtrigger> - 顶部加伪注释如
// @fragment: cameraPosition可能干扰真实编译器或预处理器,不推荐 - 更可靠的做法:用
SpectorJS在浏览器里inspect实际传入的uniform,它看到的才是运行时真实上下文
"highlight_line": true开了但当前行没颜色?配色方案缺lineHighlight规则
启用"highlight_line": true只是打开开关,真正决定颜色的是你当前.sublime-color-scheme文件里有没有lineHighlight这条规则。
- 很多轻量主题甚至默认主题都缺这条规则,结果就是“开了等于没开”
- 验证方法:打开任意代码文件,按
Ctrl+Shift+P输入Developer: Show Scope Name,光标放某行中间,看输出里有没有region.line——没有就说明主题缺失 - 解决方式:用
PackageResourceViewer: Open Resource打开当前主题文件,在"rules"数组末尾添加{"scope": "region.line", "background": "hsl(0, 0%, 90%)"}这类定义 - 或直接换主题,比如
Monokai或Brogrammer,它们默认支持lineHighlight
外置着色器修改后浏览器不刷新?大概率不是Sublime的问题
Sublime本身不运行WebGL,也不参与加载逻辑。缓存问题通常出在Three.js加载链路上。
-
THREE.FileLoader默认启用缓存,改完.frag后必须清浏览器缓存,或加时间戳参数:loader.load('shader.frag?t=' + Date.now(), ...) - 检查
onBeforeCompile回调是否被正确调用,它才是调试着色器源码的关键入口 - 若用
import方式加载字符串,注意ESM模块缓存机制,本地开发建议用FileLoader配合本地HTTP服务(如http-server) - 别在Sublime里反复重启服务——重点盯住浏览器控制台报错,
Shader compile error信息比编辑器状态更有价值











