├── README.md ├── types └── index.d.ts ├── example ├── rollup.config.js ├── package.json └── draw.frag ├── rollup.config.js ├── src ├── index.js ├── typeMap.js ├── componentTemplate.js └── compileFileToComponent.js ├── yarn.lock ├── package.json ├── LICENSE └── .gitignore /README.md: -------------------------------------------------------------------------------- 1 | # rollup-plugin-element3-webgl 2 | rollup plugin for parsing webgl 3 | -------------------------------------------------------------------------------- /types/index.d.ts: -------------------------------------------------------------------------------- 1 | import { Plugin } from "rollup"; 2 | 3 | export function element3Webgl(): Plugin; 4 | export default element3Webgl; 5 | -------------------------------------------------------------------------------- /example/rollup.config.js: -------------------------------------------------------------------------------- 1 | const element3Webgl = require("../dist/cjs/index"); 2 | 3 | module.exports = { 4 | input: "./draw.frag", 5 | output: [{ file: "./dist/build.js", format: "es" }], 6 | plugins: [element3Webgl.default()], 7 | }; 8 | -------------------------------------------------------------------------------- /rollup.config.js: -------------------------------------------------------------------------------- 1 | import pkg from "./package.json"; 2 | 3 | export default { 4 | input: "src/index.js", 5 | output: [ 6 | { file: pkg.main, format: "cjs", exports: "named" }, 7 | { file: pkg.module, format: "es" }, 8 | ], 9 | }; 10 | -------------------------------------------------------------------------------- /example/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "example", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "rollup.config.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "build": "rollup -c" 9 | }, 10 | "keywords": [], 11 | "author": "", 12 | "license": "ISC" 13 | } 14 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import compileFileToComponent from "./compileFileToComponent.js"; 2 | const fileRegex = /\.frag$/; 3 | 4 | export default function webglLoader() { 5 | return { 6 | name: "element3-webgl", 7 | transform(rawCode, id) { 8 | if (fileRegex.test(id)) { 9 | const { code } = compileFileToComponent(rawCode, null); 10 | return { code }; 11 | } else { 12 | return rawCode; 13 | } 14 | }, 15 | }; 16 | } 17 | -------------------------------------------------------------------------------- /yarn.lock: -------------------------------------------------------------------------------- 1 | # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. 2 | # yarn lockfile v1 3 | 4 | 5 | fsevents@~2.3.1: 6 | version "2.3.2" 7 | resolved "https://registry.nlark.com/fsevents/download/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a" 8 | integrity sha1-ilJveLj99GI7cJ4Ll1xSwkwC/Ro= 9 | 10 | rollup@^2.48.0: 11 | version "2.48.0" 12 | resolved "https://registry.nlark.com/rollup/download/rollup-2.48.0.tgz?cache=0&sync_timestamp=1621055154976&other_urls=https%3A%2F%2Fregistry.nlark.com%2Frollup%2Fdownload%2Frollup-2.48.0.tgz#fceb01ed771f991f29f7bd2ff7838146e55acb74" 13 | integrity sha1-/OsB7XcfmR8p970v94OBRuVay3Q= 14 | optionalDependencies: 15 | fsevents "~2.3.1" 16 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "rollup-plugin-element3-webgl", 3 | "version": "0.0.5", 4 | "description": "", 5 | "main": "./dist/cjs/index.js", 6 | "module": "./dist/es/index.js", 7 | "scripts": { 8 | "test": "echo \"Error: no test specified\" && exit 1", 9 | "build": "rollup -c" 10 | }, 11 | "types": "types/index.d.ts", 12 | "files": [ 13 | "dist", 14 | "types" 15 | ], 16 | "homepage": "https://github.com/hug-sun/rollup-plugin-element3-webgl", 17 | "keywords": [ 18 | "rollup-plugin", 19 | "element3", 20 | "webgl" 21 | ], 22 | "author": "https://github.com/cuixiaorui", 23 | "license": "ISC", 24 | "devDependencies": { 25 | "rollup": "^2.48.0" 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 花果山前端团队 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /src/typeMap.js: -------------------------------------------------------------------------------- 1 | var typeMapping = { 2 | bool: { 3 | jsType: "Boolean", 4 | ctxMethod: "uniform1fv", 5 | }, 6 | bvec2: { 7 | jsType: "Float32Array", 8 | ctxMethod: "uniform2fv", 9 | }, 10 | bvec3: { 11 | jsType: "Float32Array", 12 | ctxMethod: "uniform3fv", 13 | }, 14 | bvec4: { 15 | jsType: "Float32Array", 16 | ctxMethod: "uniform4fv", 17 | }, 18 | 19 | float: { 20 | jsType: "Number", 21 | ctxMethod: "uniform1f", 22 | }, 23 | vec2: { 24 | jsType: "Array", 25 | ctxMethod: "uniform2fv", 26 | }, 27 | vec3: { 28 | jsType: "Array", 29 | ctxMethod: "uniform3fv", 30 | }, 31 | vec4: { 32 | jsType: "Array", 33 | ctxMethod: "uniform4fv", 34 | }, 35 | 36 | int: { 37 | jsType: "Number", 38 | ctxMethod: "uniform1i", 39 | }, 40 | ivec2: { 41 | jsType: "Int32Array", 42 | ctxMethod: "uniform2iv", 43 | }, 44 | ivec3: { 45 | jsType: "Int32Array", 46 | ctxMethod: "uniform3iv", 47 | }, 48 | ivec4: { 49 | jsType: "Int32Array", 50 | ctxMethod: "uniform4iv", 51 | }, 52 | 53 | mat2: { 54 | jsType: "Float32Array", 55 | ctxMethod: "uniformMatrix2fv", 56 | }, 57 | mat3: { 58 | jsType: "Float32Array", 59 | ctxMethod: "uniformMatrix3fv", 60 | }, 61 | mat4: { 62 | jsType: "Float32Array", 63 | ctxMethod: "uniformMatrix4fv", 64 | }, 65 | 66 | sampler2D: { 67 | jsType: "Float32Array", 68 | }, 69 | 70 | samplerCube: { 71 | //TODO 72 | }, 73 | }; 74 | 75 | export function mapType(type) { 76 | return typeMapping[type]; 77 | } 78 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | lerna-debug.log* 8 | 9 | # Diagnostic reports (https://nodejs.org/api/report.html) 10 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json 11 | 12 | # Runtime data 13 | pids 14 | *.pid 15 | *.seed 16 | *.pid.lock 17 | 18 | # Directory for instrumented libs generated by jscoverage/JSCover 19 | lib-cov 20 | 21 | # Coverage directory used by tools like istanbul 22 | coverage 23 | *.lcov 24 | 25 | # nyc test coverage 26 | .nyc_output 27 | 28 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 29 | .grunt 30 | 31 | # Bower dependency directory (https://bower.io/) 32 | bower_components 33 | 34 | # node-waf configuration 35 | .lock-wscript 36 | 37 | # Compiled binary addons (https://nodejs.org/api/addons.html) 38 | build/Release 39 | 40 | # Dependency directories 41 | node_modules/ 42 | jspm_packages/ 43 | 44 | # TypeScript v1 declaration files 45 | typings/ 46 | 47 | # TypeScript cache 48 | *.tsbuildinfo 49 | 50 | # Optional npm cache directory 51 | .npm 52 | 53 | # Optional eslint cache 54 | .eslintcache 55 | 56 | # Microbundle cache 57 | .rpt2_cache/ 58 | .rts2_cache_cjs/ 59 | .rts2_cache_es/ 60 | .rts2_cache_umd/ 61 | 62 | # Optional REPL history 63 | .node_repl_history 64 | 65 | # Output of 'npm pack' 66 | *.tgz 67 | 68 | # Yarn Integrity file 69 | .yarn-integrity 70 | 71 | # dotenv environment variables file 72 | .env 73 | .env.test 74 | 75 | # parcel-bundler cache (https://parceljs.org/) 76 | .cache 77 | 78 | # Next.js build output 79 | .next 80 | 81 | # Nuxt.js build / generate output 82 | .nuxt 83 | dist 84 | 85 | # Gatsby files 86 | .cache/ 87 | # Comment in the public line in if your project uses Gatsby and *not* Next.js 88 | # https://nextjs.org/blog/next-9-1#public-directory-support 89 | # public 90 | 91 | # vuepress build output 92 | .vuepress/dist 93 | 94 | # Serverless directories 95 | .serverless/ 96 | 97 | # FuseBox cache 98 | .fusebox/ 99 | 100 | # DynamoDB Local files 101 | .dynamodb/ 102 | 103 | # TernJS port file 104 | .tern-port 105 | -------------------------------------------------------------------------------- /src/componentTemplate.js: -------------------------------------------------------------------------------- 1 | export default (vertexShader, fragmentShader, watchers, properties,uniformInit) => ` 2 | import { h, onMounted, ref, watchEffect,watch } from "vue"; 3 | 4 | export default { 5 | name: "webgl-renderer", 6 | props: { 7 | width: String, 8 | height: String, 9 | indicesCount: { 10 | default: () => 5, 11 | }, 12 | indicesStart: { 13 | default: () => 0, 14 | }, 15 | ${properties} 16 | }, 17 | 18 | 19 | setup(props) { 20 | const canvas = ref(null); 21 | let gl; 22 | let glProgram; 23 | 24 | watchEffect(() => { 25 | if (!gl || !glProgram) return; 26 | gl.drawArrays(gl.TRIANGLE_STRIP, props.indicesStart, props.indicesCount); 27 | }); 28 | 29 | onMounted(() => { 30 | //获取webgl上下文 31 | gl = canvas.value.getContext("webgl"); 32 | var vertShader = gl.createShader(gl.VERTEX_SHADER); 33 | gl.shaderSource(vertShader, \`${vertexShader}\`); 34 | gl.compileShader(vertShader); 35 | var fragShader = gl.createShader(gl.FRAGMENT_SHADER); 36 | gl.shaderSource(fragShader, \`${fragmentShader}\`); 37 | gl.compileShader(fragShader); 38 | glProgram = gl.createProgram(); 39 | gl.attachShader(glProgram, vertShader); 40 | gl.attachShader(glProgram, fragShader); 41 | gl.linkProgram(glProgram); 42 | gl.useProgram(glProgram); 43 | var a_PointSize = gl.getAttribLocation(glProgram, "a_PointSize"); 44 | gl.vertexAttrib1f(a_PointSize, 30.0); 45 | //1.创建缓冲区对象 46 | var vertexBuffer = gl.createBuffer(); 47 | // 2.绑定缓冲区对象（表明了缓冲区对象的用途） 48 | gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer); 49 | // 3.向缓冲区对象中写入数据 50 | var tempData = new Float32Array([-1, -1, -1, 1, 1, 1, 1, -1, -1, -1]); 51 | gl.bufferData(gl.ARRAY_BUFFER, tempData, gl.STATIC_DRAW); 52 | // 4.获取变量存储位置 53 | var a_Position = gl.getAttribLocation(glProgram, "a_Position"); 54 | // 5.把缓冲区对象分配给a_Position变量 55 | gl.vertexAttribPointer(a_Position, 2, gl.FLOAT, false, 0, 0); 56 | // 6.连接缓冲区对象和a_Position变量 57 | gl.enableVertexAttribArray(a_Position); 58 | gl.drawArrays( 59 | gl.TRIANGLE_STRIP, 60 | props["indicesStart"], 61 | props["indicesCount"] 62 | ); 63 | //gl.drawArrays(gl.POINTS, 0, 3); 64 | 65 | ${uniformInit} 66 | }); 67 | 68 | ${watchers} 69 | 70 | return { 71 | canvas, 72 | }; 73 | }, 74 | 75 | render: function() { 76 | return h("canvas", { 77 | ref: "canvas", 78 | width: this.$props["width"], 79 | height: this.$props["height"], 80 | }); 81 | }, 82 | }; 83 | `; 84 | -------------------------------------------------------------------------------- /example/draw.frag: -------------------------------------------------------------------------------- 1 | precision mediump float; 2 | uniform vec4 u_FragColor; 3 | const mat2 m = mat2( 0.80, 0.60, -0.60, 0.80 ); 4 | 5 | float noise( in vec2 p ) 6 | { 7 | return sin(p.x)*sin(p.y); 8 | } 9 | 10 | float fbm4( vec2 p ) 11 | { 12 | float f = 0.0; 13 | f += 0.5000*noise( p ); p = m*p*2.02; 14 | f += 0.2500*noise( p ); p = m*p*2.03; 15 | f += 0.1250*noise( p ); p = m*p*2.01; 16 | f += 0.0625*noise( p ); 17 | return f/0.9375; 18 | } 19 | 20 | float fbm6( vec2 p ) 21 | { 22 | float f = 0.0; 23 | f += 0.500000*(0.5+0.5*noise( p )); p = m*p*2.02; 24 | f += 0.250000*(0.5+0.5*noise( p )); p = m*p*2.03; 25 | f += 0.125000*(0.5+0.5*noise( p )); p = m*p*2.01; 26 | f += 0.062500*(0.5+0.5*noise( p )); p = m*p*2.04; 27 | f += 0.031250*(0.5+0.5*noise( p )); p = m*p*2.01; 28 | f += 0.015625*(0.5+0.5*noise( p )); 29 | return f/0.96875; 30 | } 31 | 32 | vec2 fbm4_2( vec2 p ) 33 | { 34 | return vec2(fbm4(p), fbm4(p+vec2(7.8))); 35 | } 36 | 37 | vec2 fbm6_2( vec2 p ) 38 | { 39 | return vec2(fbm6(p+vec2(16.8)), fbm6(p+vec2(11.5))); 40 | } 41 | uniform float iTime; 42 | vec3 iResolution = vec3(100.0, 100.0, 1.0); 43 | float func( vec2 q, out vec4 ron ) 44 | { 45 | q += 0.03*sin( vec2(0.27,0.23)*iTime + length(q)*vec2(4.1,4.3)); 46 | 47 | vec2 o = fbm4_2( 0.9*q ); 48 | 49 | o += 0.04*sin( vec2(0.12,0.14)*iTime + length(o)); 50 | 51 | vec2 n = fbm6_2( 3.0*o ); 52 | 53 | ron = vec4( o, n ); 54 | 55 | float f = 0.5 + 0.5*fbm4( 1.8*q + 6.0*n ); 56 | 57 | return mix( f, f*f*f*3.5, f*abs(n.x) ); 58 | } 59 | void mainImage( out vec4 fragColor, in vec2 fragCoord ) 60 | { 61 | vec3 r = vec3(100.0, 100.0, 1.0); 62 | vec2 p = (2.0*fragCoord-r.xy)/r.y; 63 | float e = 2.0/r.y; 64 | 65 | vec4 on = vec4(0.0); 66 | float f = func(p, on); 67 | 68 | vec3 col = vec3(0.0); 69 | col = mix( vec3(0.2,0.1,0.4), vec3(0.3,0.05,0.05), f ); 70 | col = mix( col, vec3(0.9,0.9,0.9), dot(on.zw,on.zw) ); 71 | col = mix( col, vec3(0.4,0.3,0.3), 0.2 + 0.5*on.y*on.y ); 72 | col = mix( col, vec3(0.0,0.2,0.4), 0.5*smoothstep(1.2,1.3,abs(on.z)+abs(on.w)) ); 73 | col = clamp( col*f*2.0, 0.0, 1.0 ); 74 | 75 | #if 0 76 | // gpu derivatives - bad quality, but fast 77 | vec3 nor = normalize( vec3( dFdx(f)*iResolution.x, 6.0, dFdy(f)*iResolution.y ) ); 78 | #else 79 | // manual derivatives - better quality, but slower 80 | vec4 kk; 81 | vec3 nor = normalize( vec3( func(p+vec2(e,0.0),kk)-f, 82 | 2.0*e, 83 | func(p+vec2(0.0,e),kk)-f ) ); 84 | #endif 85 | 86 | vec3 lig = normalize( vec3( 0.9, 0.2, -0.4 ) ); 87 | float dif = clamp( 0.3+0.7*dot( nor, lig ), 0.0, 1.0 ); 88 | vec3 lin = vec3(0.70,0.90,0.95)*(nor.y*0.5+0.5) + vec3(0.15,0.10,0.05)*dif; 89 | col *= 1.2*lin; 90 | col = 1.0 - col; 91 | col = 1.1*col*col; 92 | 93 | fragColor = vec4( col, 1.0 ); 94 | } 95 | 96 | void main(){ 97 | vec4 a = vec4(1.0, 1.0, 1.0, 1.0); 98 | vec4 color = vec4(1.0, 1.0, 1.0, 1.0); 99 | vec4 coord = gl_FragCoord; 100 | mainImage(color, coord.xy); 101 | 102 | gl_FragColor=color; 103 | } -------------------------------------------------------------------------------- /src/compileFileToComponent.js: -------------------------------------------------------------------------------- 1 | import fs from "fs"; 2 | import t from "./componentTemplate.js"; 3 | import { mapType } from "./typeMap"; 4 | 5 | export default function (fragmentShaderSource, map) { 6 | var hasVertexShader = false; 7 | try { 8 | var vertexShaderSource = fs.readFileSync( 9 | this.resourcePath.replace(/.frag$/, ".vert2"), 10 | "utf8" 11 | ); 12 | hasVertexShader = true; 13 | } catch (err) { 14 | var vertexShaderSource = `attribute vec4 a_Position; 15 | void main(){ 16 | gl_Position=a_Position; 17 | } 18 | `; 19 | hasVertexShader = false; 20 | } 21 | 22 | var uniformInitTemplate = (name, jsType, ctxMethod) => ` 23 | let ${name} = gl.getUniformLocation(glProgram,'${name}'); 24 | gl.${ctxMethod}(${name}, ${jsType}(props.${name})); 25 | gl.drawArrays(gl.TRIANGLE_STRIP, props['indicesStart'], props['indicesCount']); 26 | `; 27 | 28 | var watcherTemplate = (name, jsType, ctxMethod) => ` 29 | watch(()=>props.${name},(newVal)=>{ 30 | if(!gl||!glProgram) 31 | return; 32 | let ${name} = gl.getUniformLocation(glProgram,'${name}'); 33 | gl.${ctxMethod}(${name}, ${jsType}(newVal)); 34 | gl.drawArrays(gl.TRIANGLE_STRIP, props['indicesStart'], props['indicesCount']); 35 | }, 36 | { 37 | immediate: true 38 | }) 39 | `; 40 | 41 | var sampler2DTemplate = (name) => ` 42 | 43 | watch(()=> props.${name},(newVal)=>{ 44 | var image = new Image(); 45 | image.src = newVal; 46 | image.onload = () => { 47 | if(!gl||!glProgram) 48 | return; 49 | let ${name} = gl.getUniformLocation(glProgram,'${name}'); 50 | var texture = gl.createTexture(); 51 | //1.对纹理图像进行Y轴反转 52 | gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, 1); 53 | //2.开启0号纹理单元 54 | gl.activeTexture(gl.TEXTURE0); 55 | //3.向target绑定纹理对象 56 | gl.bindTexture(gl.TEXTURE_2D, texture); 57 | 58 | //4.配置纹理参数 59 | gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 60 | gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 61 | gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 62 | gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 63 | 64 | //5.配置纹理图像 65 | gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, image); 66 | 67 | //6.将0号纹理图像传递给着色器 68 | gl.uniform1i(${name}, 0); 69 | 70 | gl.clearColor(0.0,0.0,0.0,1.0); 71 | 72 | gl.clear(gl.COLOR_BUFFER_BIT); 73 | gl.drawArrays(gl.TRIANGLE_STRIP, props['indicesStart'], props['indicesCount']); 74 | } 75 | },{ 76 | immediate: true, 77 | }) 78 | `; 79 | 80 | function* getUniforms(code) { 81 | var uniformPattern = /uniform ([a-z1-9A-Z]+) ([_a-zA-Z0-9]+)/g; 82 | var uniform; 83 | while ((uniform = uniformPattern.exec(code))) { 84 | yield uniform; 85 | } 86 | } 87 | 88 | var watchersCode = ""; 89 | var propertiesCode = ""; 90 | var uniformInit = ""; 91 | 92 | for (let uniform of getUniforms(vertexShaderSource)) { 93 | watchersCode += watcherTemplate( 94 | uniform[2], 95 | mapType(uniform[1]).jsType, 96 | mapType(uniform[1]).ctxMethod 97 | ); 98 | propertiesCode += ` ${uniform[2]} : {},\n`; 99 | 100 | uniformInit += uniformInitTemplate( 101 | uniform[2], 102 | mapType(uniform[1]).jsType, 103 | mapType(uniform[1]).ctxMethod 104 | ); 105 | } 106 | for (let uniform of getUniforms(fragmentShaderSource)) { 107 | if (uniform[1] === "sampler2D") { 108 | watchersCode += sampler2DTemplate( 109 | uniform[2], 110 | mapType(uniform[1]).jsType, 111 | mapType(uniform[1]).ctxMethod 112 | ); 113 | propertiesCode += ` ${uniform[2]} : {},\n`; 114 | continue; 115 | } 116 | watchersCode += watcherTemplate( 117 | uniform[2], 118 | mapType(uniform[1]).jsType, 119 | mapType(uniform[1]).ctxMethod 120 | ); 121 | propertiesCode += ` ${uniform[2]} : {},\n`; 122 | 123 | uniformInit += uniformInitTemplate( 124 | uniform[2], 125 | mapType(uniform[1]).jsType, 126 | mapType(uniform[1]).ctxMethod 127 | ); 128 | } 129 | 130 | return { 131 | code: t( 132 | vertexShaderSource, 133 | fragmentShaderSource, 134 | watchersCode, 135 | propertiesCode, 136 | uniformInit 137 | ), 138 | map, 139 | }; 140 | } 141 | --------------------------------------------------------------------------------