Jump to content

game.load.shader is not a function?


Recommended Posts

Hey guys, total Phaser noob here.

I'm interested in doing shaders in Phaser, and looking at this example : http://phaser.io/examples/v2/filters/bacteria#comments  I should be able to use : game.load.shader('bacteria', 'assets/shaders/bacteria.frag'); to get my fragment shader loaded but I get a "Uncaught TypeError: game.load.shader is not a function"

Anyone ever encountered this issue? Looking in the docs it seems that load.shader is not even available. So I'm a bit confused as to why it is present on Phaser's official website.


Link to comment
Share on other sites

32 minutes ago, samme said:

Yup, that's why I really wonder why I can't get this working.


Here is my complete code mostly taken from the tutorials :


<!doctype html> 
<html lang="en"> 
	<meta charset="UTF-8" />
	<title>Phaser - Making your first game, part 1</title>
	<script type="text/javascript" src="js/phaser.min.js"></script>
    <style type="text/css">
        body {
            margin: 0;

<script type="text/javascript">

var game = new Phaser.Game(800, 600, Phaser.WEBGL, 'phaser-example', { preload: preload, create: create, update: update });
var filter;

function preload() {
    game.load.shader('simple', 'assets/shaders/simple.frag');

function create() {
    filter = new Phaser.Filter(game, null, game.cache.getShader('simple'));
    filter.addToWorld(0, 0, 800, 600);

function update() {




Link to comment
Share on other sites

3 hours ago, rich said:

What version of Phaser does it log out to the console when you run your example? If load.shader isn't found, it's likely not a new enough version.

You are right, the output version is 2.0.1. I'm guessing that the tutorials on the web are using an old version of the framework. Locally I got the latest Phaser from github, 2.6.2, now the question is, how do I make sure it uses this particular version?

Link to comment
Share on other sites

After a bit more research, it seems like the problem comes from my html file not finding the script file needed


Failed to load resource: net::ERR_FILE_NOT_FOUND    :   file://cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js

I changed the script from 

<script src="//cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js"></script>


<script src="http://cdn.jsdelivr.net/phaser/2.6.2/phaser.min.js"></script>

and now seems to be correct...

It's strange that the "file://" protocol would be used by default, it's even causing me issues for the call to  game.load.shader('simple', 'assets/shaders/simple.frag');

phaser.js:74719 XMLHttpRequest cannot load file:///some/path/wwwroot/Test/assets/shaders/simple.frag. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.xhr

it really should be using http since i've setuped MAMP and was able to go through all the tutorials...


EDIT : That's me being a total beginner, forgot to test my file goign through localhost:port/Project.... Hopefully it can help someone

Edited by md_lasalle
Found my issue
Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...