├── .gitignore
├── README.md
├── index.js
└── package.json


/.gitignore:
--------------------------------------------------------------------------------
 1 | .DS_Store
 2 | node_modules/
 3 | npm-debug.log*
 4 | yarn-debug.log*
 5 | yarn-error.log*
 6 | 
 7 | # Editor directories and files
 8 | .idea
 9 | *.suo
10 | *.ntvs*
11 | *.njsproj
12 | *.sln
13 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Glsl loader for webpack
 2 | 
 3 | Glsl loader for webpack2 & webpack3. It support chunks & inspire by [ShaderLoader](https://github.com/cabbibo/ShaderLoader)
 4 | 
 5 | ## Getting started
 6 | 
 7 | Install:
 8 | ``` shell
 9 | npm install shader-loader --save-dev
10 | ```
11 | 
12 | Config webpack:
13 | ``` javascript
14 | module: {
15 | 	rules: [
16 |       {
17 |         test: /\.(glsl|vs|fs)$/,
18 |         loader: 'shader-loader',
19 |         options: {
20 |           glsl: {
21 |             chunkPath: resolve("/glsl/chunks")
22 |           }
23 |         }
24 |       }
25 | 	]
26 | }
27 | ```
28 | 
29 | You can now require your glsl files:
30 | ``` javascript
31 | var vertexShader = require("shader.vs");
32 | var fragmentShader = require("shader.fs");
33 | ```
34 | 
35 | if you use $xxx in your shader its replace by the content of xxx.glsl, for example:
36 | 
37 | ``` glsl
38 | void main(void) {
39 | 	$snoise //replace by chunks/snoise.glsl
40 | }
41 | ```
42 | 
43 | Learn more about loaders & webpack:
44 | http://webpack.github.io/docs/loaders.html
45 | 
46 | ## License
47 | MIT (http://www.opensource.org/licenses/mit-license.php)
48 | 


--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
 1 | var path = require('path')
 2 | var fs = require('fs')
 3 | var loaderUtils = require('loader-utils')
 4 | 
 5 | var chunks = {}
 6 | var chunkPath = ""
 7 | 
 8 | module.exports = function(source) {
 9 | 	this.cacheable && this.cacheable()
10 | 
11 | 	var uid = new Object()
12 | 		uid.callback = this.async()
13 | 		uid.finalString = source
14 | 		uid.queue = 0
15 | 		uid.done = false
16 | 
17 | 	var options = this.getOptions() || {}
18 | 
19 | 	if(options.glsl && options.glsl.chunkPath){
20 | 		chunkPath =  options.glsl.chunkPath
21 | 	}
22 | 
23 | 	var r = /\$[\w-.]+/gi
24 | 	var match = source.match( r )
25 | 
26 | 	if(match){
27 | 		for (var i = 0; i < match.length; i++) {
28 | 			chunks[match[i]] = ""
29 | 		}
30 | 	} else {
31 | 		onChunksLoaded.call(uid)
32 | 	}
33 | 
34 | 	var keys = []
35 | 	for (var key in chunks){
36 | 		keys.push(key)
37 | 	}
38 | 	keys.sort()
39 | 	keys.reverse()
40 | 	uid.queue+=keys.length
41 | 
42 | 	for(var i=0; i < keys.length; i++){
43 | 		loadChunk.call(this, keys[i], uid )
44 | 
45 | 	}
46 | }
47 | 
48 | function loadChunk(key, uid){
49 | 	var name = key.substr(1, key.length-1)
50 | 	var headerPath = path.resolve(chunkPath+"/"+name+".glsl");
51 | 	this.dependency(headerPath)
52 | 	fs.readFile(headerPath, "utf-8", function(err, content) {
53 | 		uid.queue--
54 | 		chunks[key]=content
55 | 		if(err) {
56 | 			chunks[key]=""
57 | 			console.error("Can't open the shader chunk "+name+":\n"+err.toString())
58 | 		}
59 | 		if(uid.queue==0){
60 | 			onChunksLoaded.call(uid)
61 | 		}
62 | 	})
63 | 
64 | }
65 | 
66 | function onChunksLoaded(){
67 | 	if(this.done){ return }
68 | 	this.done = true
69 | 	var keys = []
70 | 	for (var key in chunks){
71 | 		keys.push(key)
72 | 	}
73 | 	keys.sort()
74 | 	keys.reverse()
75 | 	for(var i=0; i < keys.length; i++){
76 | 		var key = keys[i]
77 | 		var re = new RegExp("(\\"+key+")", "gi")
78 | 		this.finalString = this.finalString.replace(re,chunks[key])
79 | 	}
80 | 
81 | 	this.finalString = "module.exports = " + JSON.stringify(this.finalString)
82 | 	this.callback(null, this.finalString)
83 | }
84 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "shader-loader",
 3 |   "version": "1.3.1",
 4 |   "description": "glsl loader for webpack working with chunks (inspired by ShaderLoader from cabbibo)",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "test": "echo \"Error: no test specified\" && exit 1"
 8 |   },
 9 |   "repository": {
10 |     "type": "git",
11 |     "url": "https://github.com/Makio64/shader-loader"
12 |   },
13 |   "keywords": [
14 |     "glsl",
15 |     "webpack",
16 |     "loader",
17 |     "shader",
18 |     "chunks"
19 |   ],
20 |   "author": "David Ronai @Makio64",
21 |   "license": "MIT",
22 |   "bugs": {
23 |     "url": "https://github.com/Makio64/shader-loader/issues"
24 |   },
25 |   "homepage": "https://github.com/Makio64/shader-loader",
26 |   "dependencies": {
27 |     "loader-utils": "^3.2.0"
28 |   }
29 | }
30 | 


--------------------------------------------------------------------------------