three-shaders-composer

Gulp task to compose your shaders from raw glsl files into THREE.js shader chunks.

Usage no npm install needed!

<script type="module">
  import threeShadersComposer from 'https://cdn.skypack.dev/three-shaders-composer';
</script>

README

three-shaders-composer

Gulp task to compose your shaders from raw glsl files into THREE.js shader chunks.

Installation

Install package with NPM and add it to your development dependencies:

npm install three-shaders-composer --save

Usage


const shaders = require('three-shaders-composer')
const source = require('vinyl-source-stream')

gulp.task('shaders', ()=>{
    return gulp.src('./client/shaders/**/*')
    .pipe(shaders.compose())
    .pipe(source('shaders.js'))
    .pipe(gulp.dest('public'))
})

You suppose to have shader files named something like landscape_frag.glsl. The you will be able to access it from your code in THREE.ShaderChunk aray - THREE.ShaderChunk.landscape_frag