JavaScript 中的内联 webgl 着色器代码

Inline webgl shader code in javascript

本文关键字：代码 webgl JavaScript      更新时间：2023-09-26

我正在编写一个简单的Javascript库，它使用了一些WebGL代码。我想在.js文件中内联包含着色器源，因为我的替代方案是将它们作为脚本标签包含在每个页面中，或者将它们作为作为 AJAX 加载的单独文件。这两个选项都不是特别模块化。但是，由于javascript中缺少多行字符串，我对如何内联WebGL代码没有任何好主意。有没有我没有想到的方法？

自 2009 年以来，JavaScript 在除 IE 之外的所有浏览器中都有多行字符串。

var shader = `
code
goes
here
`;

每行使用一个字符串，然后将它们连接在一起，例如

var shader = [
   "// line1 ",
   "// line2 ",
].join(''n');

附言一般问题之前在这里讨论过，请参阅在 JavaScript 中创建多行字符串

我最终破解了这个： http://github.com/noteed/language-glsl/到代码压缩器中，通过用 Language.GLSL.Pretty 中的 hsep 替换所有vcat实例。我得到了文件中着色器代码的单行版本，然后我可以将其粘贴到字符串中。我希望在发布此内容时找到已经完成的类似解决方案。

NetBeans 处理这种情况的方式如下：

var shader = 
"firstLine'n'
secondLine'n'
thirdLine";

我发现这种编辑方式比必须为每行创建一个数组项更有效。

相关文章：