mac配置GLSL(OepnGL Shading Language)開發環境

由于xcode過于臃腫，不利于日常學習使用，是以本文采用vscode作為IDE。

1 安裝vscode

前往vscode官網下載下傳安裝即可。

2. vscode 安裝Shader languages support for VS Code擴充

如下在vscode擴充商店中搜尋相關插件并安裝：

3. 安裝 glsl-canvas擴充

此插件主要用于展示預覽我們的GLSL着色器。

4. 安裝配置GLSL Lint

此插件主要用于代碼提示以及錯誤檢查。

4.1 安裝vscode插件

4.2 配置glslang

Glslang 是 OpenGL ES 和 OpenGL 着色語言的官方參考編譯器前端。它對這些語言的規範進行了嚴格的解釋,可用于錯誤檢查，可前往glslang官網下載下傳：

下載下傳解壓後，把内部的lib，include以及bin裡的檔案拖動至

/usr/local

下相對應的檔案夾下

4.3 配置vscode

通過vscode指令台（mac運作通過 ⌘ ⇧ P， windows運作通過ctrl ⇧ P）打開配置中心，在擴充中找到glsl-lint的配置:

配置其語言包路徑為

/usr/local/bin/glslangValidator

:

通過vscode指令台打開代碼片段配置，打開glsl的相應json配置檔案：

将此位址的json檔案内容拷貝進去：

5. 重新開機vscode

安裝上述插件後需要重新開機vscode，重新開機後編寫glsl代碼就有了代碼提示和錯誤檢查功能。

6. 編寫demo

在自己的代碼目錄下建立

test.frag

檔案，并寫入如下代碼：

#ifdef GL_ES
precision mediump float;
#endif

void main() {
    gl_FragColor =  vec4(1.0);
}
           

打開vscode指令控制台，輸入

Show glslCanvas

:

然後可以在旁邊看到預覽視窗：